【问题标题】:cycle as backgound image is NOT working循环作为背景图像不起作用
【发布时间】:2014-04-11 05:17:07
【问题描述】:

我正在尝试将图像循环为背景图像,但它不起作用。

我知道如何在 li 标签内制作带有 img 标签的滑块,但它必须保持该格式作为背景图片

HTML:

<ul>
    <li id="img1"></li>
    <li id="img2"></li>
    <li id="img3"></li>
    <li id="img4"></li>
</ul>


<script src="http://malsup.github.com/jquery.cycle.all.js"></script>
<script src="http://malsup.github.com/jquery.easing.1.3.js"></script>
<script>$('li').cycle();</script>

CSS:

* { 
    margin: 0;
    padding: 0;
    list-style: none;
}

li {
    background-repeat: no-repeat;
    border: 1px black solid;
    height: 100px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100px;
    z-index: 1;
}

#img1 {
    background-image : url('http://www.lyricsmode.com/i/upictures/205882.gif');
}

#img2 {
    background-image : url('http://media.merchantcircle.com/20649169/Husky-Logo-100x100_full.gif');
}

#img3 {
    background-image : url('http://www.wolfontheloose.com/assets/images/BioHazard_100x100_.jpg');
}

#img4 {
    background-image : url('http://avatarmaker.net/free-avatars/avatars/games_225/worms_261/worms_firearms_avatar_100x100_69290.jpg');
}

jsFiddle:

http://jsfiddle.net/fj5V3/1/

【问题讨论】:

    标签: jquery css image fullscreen stretch


    【解决方案1】:

    它用于父元素。像这样调用

    $('ul').cycle();
    

    小提琴here

    【讨论】:

      猜你喜欢
      • 2023-03-03
      • 2018-05-08
      • 2016-09-27
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-06-01
      相关资源
      最近更新 更多