Изображение слайдера jquery не сдвигается

Question

Изображение слайдера jquery не сдвигается

0

Я использую ползунок jquery, и я хочу переместить свое изображение в соответствии с тем, как движется ползунок, но по какой-то причине его не работает для меня вот код

   .main{
        background: transparent  url(/img/ads/bootsImg.jpg) no-repeat 20px 30px;;
        width: 300px;
        background-size: 322px;
        font-family: 'Futura-Book';

    }

<div id="background-image-horizontal"></div>

//слайдер

$('#background-image-horizontal').slider({
                max: 50,
                min: 10,
                value: 14,
                slide: function(e,ui) {
                    console.log("transparent url(/img/ads/bootsImg.jpg) no-repeat "+ui.value+"px 1px");
                    $('.main').css("background","transparent url(/img/ads/bootsImg.jpg) no-repeat "+ui.value+"px 1px");
                }
            });

В моей консоли я вижу, что это меняется, когда я перемещаю слайдер, но на моем экране изображение не перемещается

transparent url(/img/ads/bootsImg.jpg) no-repeat 28px 1px ?img=bootsImg.jpg&w=300&h=300:330
transparent url(/img/ads/bootsImg.jpg) no-repeat 29px 1px ?img=bootsImg.jpg&w=300&h=300:330
transparent url(/img/ads/bootsImg.jpg) no-repeat 30px 1px ?img=bootsImg.jpg&w=300&h=300:330
transparent url(/img/ads/bootsImg.jpg) no-repeat 31px 1px ?img=bootsImg.jpg&w=300&h=300:330
transparent url(/img/ads/bootsImg.jpg) no-repeat 32px 1px ?img=bootsImg.jpg&w=300&h=300:330
transparent url(/img/ads/bootsImg.jpg) no-repeat 33px 1px ?img=bootsImg.jpg&w=300&h=300:330

Autolycus 27 сен. 2013, в 22:06

Источник

Теги:

jquery

jquery-ui

1 ответ

Ещё вопросы

PSL · Accepted Answer · 2013-09-27T17-38-00.000Z

Одна из причин может заключаться в том, что у вас нет высоты, указанной для вашего .main и я считаю, что это div, поэтому он занимает 0 высоту. попробуйте установить некоторую height.

.main{
        background: transparent  url(/img/ads/bootsImg.jpg) no-repeat 20px 30px;;
        width: 300px;
        height:200px; /*Set some height*/
        background-size: 322px;
        font-family: 'Futura-Book';

    }

демонстрация