小编Ada*_*son的帖子

为什么不对表元素应用填充?

这更像是"告诉我为什么它不起作用"而不是"帮助我修复它"的问题.如果我尝试将填充应用于表中的thead或tr元素,则它不起作用.填充的唯一方法是将其直接应用于th或td元素.为什么会这样?是否有一种简单的方法可以将填充应用于整个thead或tr或将其添加到th和td唯一的选项?

<table>
    <thead>
        <tr>
            <th>Destination</th>
            <th>Size</th>
            <th>Home Value</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>test 1</td>
            <td>test 2</td>
            <td>test 3</td>
        </tr>
    </tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

注意thead上的10px填充.

table {
    width: 100%;
}

thead {
    text-align: left;
    background-color: yellow;
    padding: 10px;
}
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/5VQB7/

html css

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

如何使用 noUISlider 加载多个带有值和工具提示的滑块?

我正在尝试使用 noUISlider 加载多个滑块,但它不起作用。使用第一个滑块时,第二个和第三个滑块的值会发生变化。如何重构一个滑块的代码,以便我可以轻松添加具有不同选项的其他滑块?

这是一个小提琴,下面是我的代码。

// noUISlider
        var actSlider = document.getElementById('act-slider');

        noUiSlider.create(actSlider, {
            start: [0, 50],
            connect: false,
            step: 1,
            range: {
                'min': 0,
                'max': 50
            },
            format: {
                to: function (value) {
                    return value + '';
                },
                from: function (value) {
                    return value.replace('', '');
                }
            }
        });

        // Connect bar
        var connectBar = document.createElement('div'),
            connectBase = actSlider.getElementsByClassName('noUi-base')[0],
            connectHandles = actSlider.getElementsByClassName('noUi-origin');

        // Give the bar a class for styling and add it to the slider.
        connectBar.className += 'connect';
        connectBase.appendChild(connectBar); …
Run Code Online (Sandbox Code Playgroud)

nouislider

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

如何在tinymce编辑器中删除10px的增加宽度到Wordpress图像标题?

我正在使用一段代码来有效地删除增加宽度的10px Wordpress添加到网站前端的标题图像.但是,它仍然在tinymce编辑器中添加10px:

<dl id="attachment_69" class="wp-caption alignleft" style="width: 310px" data-mce-style="width: 310px;">
Run Code Online (Sandbox Code Playgroud)

我怎样才能删除这个10px?我已经尝试通过在几个地方将"10 +"更改为0来修改核心(糟糕的想法,我知道),但我没有运气.

谢谢!

wordpress tinymce caption

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

如何在Bootstrap jQuery Tab中重新加载Google Map

我正在使用gmaps.js在Bootstrap选项卡中加载2个地图.会发生什么,第一个地图加载正常,但是当单击第二个选项卡(隐藏)时,地图无法正确加载.经过广泛的谷歌搜索,我意识到这与谷歌地图有关,需要在点击选项卡时调整大小,因为谷歌地图不能很好地与隐藏的标签.然而,在尝试了很多东西后,我无法让它发挥作用.这是我的小提琴:http://jsfiddle.net/7PueE/

/**
  * Fort Collins Map
  */
$(document).ready(function () {
map = new GMaps({
  div: '#fort-collins-map',
  lat: 40.574859,
  lng: -105.056756,
  width: '100%',
          height: '500px',
          scrollwheel: false,
    });
    map.addMarker({
      lat: 40.574859,
      lng: -105.056756,
      title: 'Fort Collins Office',
              infoWindow: {
                content: '<div class="bubble-wrap"><p class="office">Fort Collins Office</p><p>1120 E. Elizabeth St.</p><p>Suite F-101</p><p>Fort Collins, CO 80524</p><a href="https://www.google.com/maps/dir//1120+E+Elizabeth+St,+Fort+Collins,+CO+80524/@40.5748591,-105.0567559,17z/data=!4m13!1m4!3m3!1s0x87694ae0b3695899:0x5510539035305077!2s1120+E+Elizabeth+St!3b1!4m7!1m0!1m5!1m1!1s0x87694ae0b3695899:0x5510539035305077!2m2!1d-105.0567559!2d40.5748591">Directions</a></div>'
              }
    });
});
/**
  * Loveland Map
  */
$(document).ready(function () {
map = new GMaps({
  div: '#loveland-map',
  lat: 40.431917,
  lng: -105.078848,
  width: '100%',
          height: '500px', …
Run Code Online (Sandbox Code Playgroud)

jquery google-maps twitter-bootstrap jquery-gmap3 twitter-bootstrap-3

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

如何将这个凌乱的jQuery转换为不那么臃肿和响应

我正在使用jQuery cycle2和carousel插件在我的网站上显示一些事件.这一切都很好但我希望可见选项在平板电脑(768px和1030px之间)上从5变为3,然后在手机上变为1(小于768px).所有其他选项可以保持不变.这段代码被黑客攻击并且混乱,所以我正在寻找一种更好的方法来实现它.此外,目前它只适用于刷新.这很好,但如果重新加载并在调整大小时实时工作会很好.这是我目前的代码:

// Events
var ww = document.body.clientWidth;
$(document).ready(function() {
    adjustEvents();
})
$(window).bind('resize orientationchange', function() {
    ww = document.body.clientWidth;
    adjustEvents();
});

var adjustEvents = function() {
    if (ww > 1030) {
        $('.cycle').cycle({
            fx:'carousel',
            swipe:true,
            timeout:5000,
            slides:'> article',
            carouselVisible:5,
            carouselFluid:true,
            autoHeight:'calc',
            prev:'#prev',
            next:'#next'
        });
    } 
    else if (ww >= 768) {
        $('.cycle').cycle({
            fx:'carousel',
            swipe:true,
            timeout:5000,
            slides:'> article',
            carouselVisible:3,
            carouselFluid:true,
            autoHeight:'calc',
            prev:'#prev',
            next:'#next'
        });
    }
    else if (ww < 768) {
        $('.cycle').cycle({
            fx:'carousel',
            swipe:true,
            timeout:5000,
            slides:'> article',
            carouselVisible:1,
            carouselFluid:true,
            autoHeight:'calc',
            prev:'#prev',
            next:'#next' …
Run Code Online (Sandbox Code Playgroud)

javascript jquery jquery-cycle

-2
推荐指数
1
解决办法
175
查看次数