javascript - how to change attributes of an Object using jQuery or Javascript

Question

I am using BxSlider for creating a carousel and I have the slider working but i wanted to add a functionality where I need to change the value of an object to false

$(document).ready(function () {
    var slider = $('.bxslider').bxSlider({
        speed: 10000,
        slideWidth: 170,
        slideMargin: 5,
        minSlides: 4,
        maxSlides: 10,
        ticker: true,
        nextSelector: '#slider-next',
        prevSelector: '#slider-prev',
        nextText: '<img src="images/next.png">',
        prevText: '<img src="images/prev.png">'
    });

i want to change the value of ticker to false on hover. I am not sure how to

$('.className').hover(function () { ///How should I change the value here  }); 

I have looked at attr() in jQuery but it didn't work

$('.className').hover(function () {
    slider.attr('ticker', false);
});

but i guess it just targets what is outside the BxSlider();

Answer 1

你可以这样做来改变Ticker mode：

// Cache the slider element
var $slider = $('.bxslider');

// Initialize the slider
$slider.bxSlider({
    speed: 10000,
    slideWidth: 170,
    slideMargin: 5,
    minSlides: 4,
    maxSlides: 10,
    ticker: true,
    nextSelector: '#slider-next',
    prevSelector: '#slider-prev',
    nextText: '<img src="images/next.png">',
    prevText: '<img src="images/prev.png">'
});

// On hover change the slider ticker option to false
$('.className').hover(function () {
    $slider.bxSlider({ ticker: false });
});

更新

// Initialize the slider
$slider.bxSlider({
    speed: 10000,
    slideWidth: 170,
    slideMargin: 5,
    minSlides: 4,
    maxSlides: 10,
    ticker: true,
    nextSelector: '#slider-next',
    prevSelector: '#slider-prev',
    nextText: '<img src="images/next.png">',
    prevText: '<img src="images/prev.png">',
    tickerHover: true   // true, false - if true ticker will pause on mouseover
});

Answer 2

To pause the ticker on hover, simply set the tickerHover option to true.

var slider = $('.bxslider').bxSlider({
        speed:10000,            
        slideWidth: 170,
        slideMargin:5,
        minSlides:4,
        maxSlides:10,           
        ticker:true,
        nextSelector: '#slider-next',
        prevSelector: '#slider-prev',
        nextText: '<img src="images/next.png">',
        prevText: '<img src="images/prev.png">',
        tickerHover : true // <------------------------- here
});

Answer 3

这将为您工作：

$('.className').hover(function () {
      $slider.bxSlider({ ticker: false });
});