小编LOT*_*SMS的帖子

覆盖google recaptcha css以使其响应

我在一个网站(不是Wordpress网站或Joomla)中安装了Google Recaptcha所以不要提供任何WP插件或Joomla扩展:)

我的问题是,该网站是响应式的,而recaptcha则不是.当我使用Firebug查找其样式时,我意识到不仅Google提供的库不包含css文件,而且我无法在custom-styles.css文件中覆盖它们,因为Google非常周到地应用了!important选择器hack在他们的CSS中一切,但我甚至尝试对它进行分类,以便我可以做出违规并希望覆盖Google的样式但是插件不起作用:(

有任何想法吗?

ps我也没有使用不同的重新验证码.抱歉.我敢肯定这里有一些收藏极客;)

这是HTML.这就是recaptcha.php从服务器呈现的内容.这不是我在实际PHP页面中所拥有的...(没有CSS,这是主要问题)

<div id="recaptcha_widget_div" style="" class=" recaptcha_nothad_incorrect_sol recaptcha_isnot_showing_audio"><div id="recaptcha_area"><table id="recaptcha_table" class="recaptchatable recaptcha_theme_red"> 
  <tbody>
     <tr> 
        <td colspan="6" class="recaptcha_r1_c1"></td> 
     </tr> 
     <tr> 
        <td class="recaptcha_r2_c1"></td> 
        <td colspan="4" class="recaptcha_image_cell">
            <center><div id="recaptcha_image" style="width: 300px; height: 57px;">
                  <img id="recaptcha_challenge_image" alt="reCAPTCHA challenge image" height="57" width="300" src="http://www.google.com/recaptcha/api/image?c=03AHJ_VutTaFjCI-gV3f3W2_M6gix7arVpF-9EOz-f773U5LmDrl33mKCn9wMXYGe0t8-xy-1HD0ysHzOI_NYyOtxOxD_a4Jj5G5h4bDMalKBQ5PDJaaE6ur8K44ilzimisHHYX6xZJ4y9xeuP6lT4vQa59-nNPju3VrlolnYgbM6oKgD7el1Rr9cpbRojjc_2zFraHkTjxyUU"></div>
            </center>
         </td> 
         <td class="recaptcha_r2_c2"></td> 
      </tr> 
      <tr> 
         <td rowspan="6" class="recaptcha_r3_c1"></td> 
         <td colspan="4" class="recaptcha_r3_c2"></td> 
         <td rowspan="6" class="recaptcha_r3_c3"></td> 
      </tr> 
      <tr> 
         <td rowspan="3" class="recaptcha_r4_c1" height="49"> 
              <div class="recaptcha_input_area"> 
                  <span id="recaptcha_challenge_field_holder" style="display: none;">                      
                      <input type="hidden" name="recaptcha_challenge_field" id="recaptcha_challenge_field" value="03AHJ_VutTaFjCI-gV3f3W2_M6gix7arVpF-9EOz-f773U5LmDrl33mKCn9wMXYGe0t8-xy-1HD0ysHzOI_NYyOtxOxD_a4Jj5G5h4bDMalKBQ5PDJaaE6ur8K44ilzimisHHYX6xZJ4y9xeuP6lT4vQa59-nNPju3VrlolnYgbM6oKgD7el1Rr9cpbRojjc_2zFraHkTjxyUU"></span>
                      <input name="recaptcha_response_field" …
Run Code Online (Sandbox Code Playgroud)

css recaptcha responsive-design

14
推荐指数
2
解决办法
5万
查看次数

如何在angularjs中播放声音

使用API​​获取要在音频标签
View中播放的声音的url

<img src="../img/play.svg" alt="Play" ng-click="playSound('exampleWord')" width="48"/>
Run Code Online (Sandbox Code Playgroud)

控制器:

$scope.playSound=function(input){
    $scope.audio={};
    soundFetch.getSound(input).success(function(data){
        $scope.audio=data;
    });
}
Run Code Online (Sandbox Code Playgroud)

soundFetch是调用getSound函数的服务.返回的数据是歌曲的网址.单击img标签后如何播放声音.目前收到错误Error: [$interpolate:interr]

audio angularjs

13
推荐指数
1
解决办法
2万
查看次数

根据视口大小有条件地进行渲染

对你来说这应该是一个简单的反应怪物.:)我已经写了条件,但我无法弄清楚如何在我的构造函数中处理视口大小以使条件工作.简单明了,我希望在视口大小为1451px或更宽时显示一个元素,在1450px或更小时显示另一个元素.

这是我的代码(简化)

class My Class extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            isDesktop: "1450px" //This is where I am having problems
        };
    }

    render() {
        const isDesktop = this.state.isDesktop;

        return (
            <div>
                {isDesktop ? (
                    <div>I show on 1451px or higher</div>
                ) : (
                    <div>I show on 1450px or lower</div>
                )}
            </div>
        );
    }
}
Run Code Online (Sandbox Code Playgroud)

也许我倾向于使用ComponentWillMount或ComponentDidMount来处理它.老实说,不确定.我是React的新手.

先谢谢你们.

reactjs

13
推荐指数
3
解决办法
1万
查看次数

jVectorMaps图像标记

我知道这个问题已经被问到了,但是op没有提供任何代码,我显然无法编辑他的答案,所以我将开始一个新的.我的目标是用自定义的drop-pin标记替换点,我最终会为它做一些其他动作.所以作为一个踢球者,必须以某种方式(也许和id)识别这样的动作,以便我可以从jQuery,CSS或javascript中调用它并给它一些用处.

背景:

我从jVectorMaps中提取了宾夕法尼亚州的地图,以及解释如何使用此链接标记图标中的标记图像的部分中的代码.

这是原始代码:

$(function(){
   var plants = [
   {name: 'KKG', coords: [49.9841308, 10.1846373], status: 'activeUntil2018'},
   {name: 'KKK', coords: [53.4104656, 10.4091597], status: 'closed'},
   {name: 'KWG', coords: [52.0348748, 9.4097793], status: 'activeUntil2022'},
   {name: 'KBR', coords: [53.850666, 9.3457603], status: 'closed', offsets: [0, 5]}
];

new jvm.Map({
   container: $('#map'),
   map: 'de_merc',
   markers: plants.map(function(h){ return {name: h.name, latLng: h.coords} }),
   labels: {
      markers: {
        render: function(index){
          return plants[index].name;
        },
        offsets: function(index){
          var offset = plants[index]['offsets'] || [0, 0];

          return [offset[0] - …
Run Code Online (Sandbox Code Playgroud)

javascript jvectormap

8
推荐指数
1
解决办法
3665
查看次数

使用Angular从数组中删除项目

是的,之前有人问过,我已经阅读了所有的答案,但似乎没有任何效果.所以我要求额外的一双眼睛,看看你是否能在我的代码中发现任何单一性,使其无法正常工作.(我在其他地方尝试了这个代码和逻辑,似乎工作正常).顺便说一句,控制台没有错误

当有人点击图片上的x时,我只是想从视图中删除一个项目.

这是控制器

app.controller('galleryController', ['$scope', '$http', function($scope, $http) {
    $http.get('data/galleries.json').success(function(data){
        $scope.galleries = data;
    }).error(function(error) {
        console.log(error);
    });

    $scope.removeGalleryItem=function(gallery){
        var removedGallery = $scope.galleries.indexOf(gallery);
        $scope.galleries.splice(removedGallery, 1);
    };
}]);
Run Code Online (Sandbox Code Playgroud)

和我的看法

<div class="col-xs-12 col-md-3" ng-repeat="gallery in galleries" >
    <a class="gallery-item" ng-href="{{gallery.img}}" ng-class="{true:'active',false:''}[checked]"
       title="Nature Image 1" >
        <div class="image">
            <img ng-src="{{gallery.img}}" alt="Nature Image 1"/>

        </div>
        <div class="meta">
            <strong>{{gallery.title}}</strong>
            <span>{{gallery.desc}}</span>
        </div>
    </a>
    <ul class="gallery-item-controls">
        <li><label class="check"><input type="checkbox" class="icheckbox" ng-model="checked" /></label></li>
        <li><span class="gallery-item-remove"><i class="fa fa-times" ng-click="removeGalleryItem(gallery)"></i></span></li>
    </ul>
</div>
Run Code Online (Sandbox Code Playgroud)

Angular 1.5.8

谢谢

angularjs

8
推荐指数
1
解决办法
727
查看次数

使用微调器加载iframe

此代码正确加载微调器,但如何在加载完成后隐藏它?

iframe {
    background-image: url("http://jimpunk.net/Loading/wp-content/uploads/loading2.gif");   
    background-repeat: no-repeat;
    background-position: 50% 50%;
}
Run Code Online (Sandbox Code Playgroud)

javascript iframe jquery

7
推荐指数
2
解决办法
1万
查看次数

选项卡过滤角度

我正在接受一个早已过期的Angular研讨会,我正在尝试将页面从常规JQuery转换为Angular功能.我坚持的一件事是用ng-click激活过滤器(至少我认为这是首选方法).

所以基本上我在左边有一个画廊和一个菜单,上面有这些图像的类别(组).这些组根据左侧的菜单显示.所以,4组(女孩,自然,音乐,太空).图像分为这些组.如果我按下女孩,我应该只看到小组中的图像:女孩,如果我按自然,我应该只看到组中的图片:自然等等,如果我按下All,我应该看到它们全部.

好吧,它不起作用.即使我遵循了如何使用多个链接过滤AngularJS中的列表.

这是一个提供想法的页面的视觉效果

这是我的代码

HTML

<div class="content-body" ng-controller="galleryController as panel">
  <div class="col-xs-12 col-md-3">
    <div class="content-sidebar">
      <div class="side-widget menu">
        <h4>Groups:</h4>
        <div class="border-bottom">
          <ul ng-init="tab = 1" class="list-group">
            <li ng-class="{active:panel.isSelected(1)}">
              <a class="list-group-item" ng-click="panel.selectTab(1); groupFilter = {}">All <span
                                            class="badge badge-primary">12</span></a>
            </li>
            <li ng-class="{active:panel.isSelected(2)}">
              <a class="list-group-item" ng-click="panel.selectTab(2); groupFilter ={group:'nature'}">Nature <span
                                                class="badge badge-success">7</span></a>
            </li>
            <li ng-class="{active:panel.isSelected(3)}">
              <a class="list-group-item" ng-click="panel.selectTab(3)">Music <span
                                                class="badge badge-danger">3</span></a>
            </li>
            <li ng-class="{active:panel.isSelected(4)}">
              <a class="list-group-item" ng-click="panel.selectTab(4)">Space <span
                                                class="badge badge-info">2</span></a>
            </li>
            <li ng-class="{active:panel.isSelected(5)}">
              <a class="list-group-item" ng-click="panel.selectTab(5)">Girls <span
                                                class="badge badge-warning">3</span></a>
            </li>
          </ul> …
Run Code Online (Sandbox Code Playgroud)

angularjs angular-filters

7
推荐指数
1
解决办法
1429
查看次数

带有进度条的Bootstrap nav-tabs

我正在构建一个注册系统,我在该页面中有一个进度条和一个bootstrap nav-tabs.我正在尝试设置JQuery,以便使用nav-tabs进度条前进.这是一个视觉.

在此输入图像描述

我尝试使用hasClass和addCLass函数提出一个简单的if else条件jquery,但从来没有弄过.

像这样的东西:

$(document).ready(function () {
   $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
     if (".nav-tabs") hasClass(".active"); {
       $(".checkout-bar li").addClass("active");
     }
   });
});
Run Code Online (Sandbox Code Playgroud)

我附加了一个CODEPEN

关于如何做这个客户端的任何想法?我宁愿把C#从这个中拿出来

javascript jquery css3 twitter-bootstrap-3

5
推荐指数
1
解决办法
1万
查看次数

NPM安装无法在Windows中

我不知道这里发生了什么。希望有人可以帮助我。

这在我的Mac中效果很好。但是Windows和npm安装中的相同过程会崩溃。这就是我得到的。

编辑

到目前为止,我已经尝试了我所看到的所有内容以及Google搜索产生的每个链接。我试过的建议如下这里

rm -rf node_modules
npm install
Run Code Online (Sandbox Code Playgroud)

没工作

以管理员身份运行它,

尝试过npm install -g

重新启动xampp服务器

关闭Windows Defender

检查了C:\ Program Files \ nodejs的PATH

除了抛出此POS Windows窗口外,我还没有做任何事情。冰雹苹果!

warn optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\node_modules\fsevents):
warn notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.0.17: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
verbose notsup SKIPPING OPTIONAL DEPENDENCY: Valid OS:    darwin
verbose notsup SKIPPING OPTIONAL DEPENDENCY: Valid Arch:  any
verbose notsup SKIPPING OPTIONAL DEPENDENCY: Actual OS:   win32
verbose notsup SKIPPING OPTIONAL DEPENDENCY: Actual Arch: x64
warn fuse@1.4.4 …
Run Code Online (Sandbox Code Playgroud)

node.js npm

5
推荐指数
2
解决办法
3万
查看次数

用角度ng单击旋转图标

我正在构建一个可折叠的下拉垂直菜单,除使我无法理解的所有功能外,我已经完成了大多数其他功能。也就是说,旋转图标,使其在打开时显示,在关闭时指向下方。

我有一个可以使用的CodePen。我更新了下面的代码以显示现在最接近解决方案的更改。

这是我的HTML

<div class="cnt">
    <div class="menu-item" ng-click="toggle(1); open1=!open1">
        <md-list layout="row" layout-padding="" class="layout-row" layout-align="start center" flex> 
            <span class="title flex" flex=""> Menu Item</span>
            <i class="fa fa-chevron-down" ng-class="{'fa fa-chevron-down rotate180': open1, 'fa fa-chevron-down': !open1}"></i>
        </md-list>
        <div class="sub-menu" ng-animate="'animate'" >
            <md-menu-item ng-if="menuIsOpen===1" ng-repeat="item in data"  >
                <md-button>
                    <div layout="row" flex="">
                        <a ui-sref="{{item.link}}">
                            <p flex=""><i class="fa fa-{{item.icon}}"></i> {{item.title}}</p>
                        </a>
                    </div>
                </md-button>
            </md-menu-item>
        </div>
    </div>
    <div class="menu-item" ng-click="toggle(2); open2=!open2">
        <md-list layout="row" layout-padding="" class="layout-row" layout-align="start center" flex> 
            <span class="title flex" flex=""> Menu Item 2</span> …
Run Code Online (Sandbox Code Playgroud)

javascript angularjs

5
推荐指数
1
解决办法
2497
查看次数