Question

我使用以下代码在我的网站上发布javascript幻灯片 - http://leemark.github.io/better-simple-slideshow/。我正在尝试实现链接上给出的示例2。我必须做错事，因为我得到的只是空白屏幕。没有图像和标题。

这是我在网站上的代码。

    <div class="bss-slides num2" tabindex="2">
           <figure>
              <img src="bodhgaya.jpg" width="100%" /><figcaption>"Snowying" by <a href="http://www.flickr.com/photos/fiddleoak/8511209344/">fiddleoak</a>.</figcaption> 
           </figure>
            <figure>
                <img src="chardham.jpg" width="100%" /><figcaption>"Starlight" by <a href="http://www.flickr.com/photos/chaoticmind75/10738494123/in/set-72157626146319517">ChaoticMind75</a>.</figcaption> 
           </figure>
           <figure>
              <img src="taj.jpg" width="100%" /><figcaption>"Snowstorm" by <a href="http://www.flickr.com/photos/tylerbeaulawrence/8539457508/">Beaulawrence</a>.</figcaption> 
           </figure>
            <figure>
              <img src="konarksuntemple.jpg" width="100%" /><figcaption>"Misty winter afternoon" by <a href="http://www.flickr.com/photos/22746515@N02/5277611659/">Bert Kaufmann</a>.</figcaption> 
           </figure>
            <figure>
              <img src="http://themarklee.com/wp-content/uploads/2013/12/good-morning.jpg" width="100%" /><figcaption>"Good Morning!" by <a href="http://www.flickr.com/photos/frank_wuestefeld/4306107546/">Frank Wuestefeld</a>.</figcaption> 
           </figure>
        </div>
<script src="hammer.min.js"></script><!-- for swipe support on touch interfaces -->
<script src="better-simple-slideshow.min.js"></script>
<script>
var opts = {
    auto : {
        speed : 3500, 
        pauseOnHover : true
    },
    fullScreen : false, 
    swipe : true
};
makeBSS('.num1', opts);
var opts2 = {
    auto : false,
    fullScreen : true,
    swipe : true
};
makeBSS('.num2', opts2);
</script>

Answer 1

我克隆了回购并检查你的代码。唯一的区别是图片的来源。所以我把代码放在this fiddle上。

I just add the css code

当然你看不到任何图片，但你可以看到幻灯片标题。那你在代码中添加了css样式吗？

Javascript幻灯片问题。得到空白屏幕

1 个答案: