【问题标题】:Change bg color of carousel on image change [closed]在图像更改时更改轮播的背景颜色 [关闭]
【发布时间】:2013-08-08 06:19:49
【问题描述】:

(对不起我的英语)

我想用 javascript 更改我的幻灯片背景 css,例如当幻灯片显示第二张图片时。

这是我的页面链接:http://2013.original-k9.de/index.php/julius-k9-kontakt/valami

以及源代码:

<div id="myCarousel" class="carousel slide">
<ol class="carousel-indicators" style="list-style: none;">
    <li class="active" data-target="#myCarousel" data-slide-to="0"></li>
    <li data-target="#myCarousel" data-slide-to="1"></li>
</ol>
<!-- Carousel items -->
<div class="carousel-inner">
    <div class="active item"><img src="images/headers/3_14.jpg" alt="3 14" />
    </div>
    <div class="item"><img src="images/headers/3.jpg" alt="3" />
    </div>
</div>
<!-- Carousel nav --><a class="carousel-control left" href="#myCarousel" data- slide="prev">‹</a><a class="carousel-control right" href="#myCarousel" data-   slide="next">›</a>
</div>
<!-- Call Carousel -->
<script type="text/javascript">
// <![CDATA[
(function($) {
    $('.carousel').carousel({});
})(jQuery);
// ]]>

</script>

感谢您的帮助!

【问题讨论】:

    标签: javascript css twitter-bootstrap background carousel


    【解决方案1】:

    您也可以像这样以旧样式进行操作:

    function setColor(element, color)
    {
        element.style.backgroundColor = color;
    }
    

    希望对你有帮助。

    【讨论】:

      【解决方案2】:

      试试这个

        $(this).css({'background-color': '#ccc'});
        $('a', this).css({'color': 'red'});
      

      【讨论】:

        【解决方案3】:

        你想要的是类似下面的东西

        $('#your-element').css('background-color', '#cccccc');
        

        应用的位置和方式取决于您的滑块...

        例如,您可以在轮播功能中执行此操作,或使用 setInterval 等更改颜色。

        【讨论】:

          【解决方案4】:

          您可以使用 jQuery 来更改 css 属性:

          $('#element_ID_whose_css_should_be_changed').css({'property_you_want_to_set_or_change' : 'new_value_for_property'});
          

          (这可以用来改变背景相关的css属性)

          【讨论】:

            猜你喜欢
            • 2018-04-17
            • 2021-11-22
            • 1970-01-01
            • 2014-04-26
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 2018-02-21
            相关资源
            最近更新 更多