Question

我正在为我的网站制作一个纯css3图像滑块 - 左/右箭头滑动功能在本地测试时效果很好，但是当我上传到我的项目时 - 箭头不会立即显示（必须切换）无线电）然后左/右箭头，点击时只返回第一张幻灯片。我试图让选择器更加独特，因为我认为它们可能会在网站的其他地方拾取某些东西，但这似乎不起作用。有什么建议？

http://jsfiddle.net/jyka1mz8/

    <div class="wav-gal-slider-outer-container">

    <div class="wav-gal-container">
    <div class="wav-gal-slider-container">

    <input id="wav-gal-slider-1" type="radio" name="wav-gal-slider-radio-set" class="wav-gal-slider-selector1" checked="checked" />
    <label for="wav-gal-slider-1" class="wav-gal-slider-label-1"></label>

    <input id="wav-gal-slider-2" type="radio" name="wav-gal-slider-radio-set" class="wav-gal-slider-selector2" />
    <label for="wav-gal-slider-2" class="wav-gal-slider-label-2"></label>

    <input id="wav-gal-slider-3" type="radio" name="wav-gal-slider-radio-set" class="wav-gal-slider-selector3" />
    <label for="wav-gal-slider-3" class="wav-gal-slider-label-3"></label>

    <input id="wav-gal-slider-4" type="radio" name="wav-gal-slider-radio-set" class="wav-gal-slider-selector4" />
    <label for="wav-gal-slider-4" class="wav-gal-slider-label-4"></label>

    <input id="wav-gal-slider-5" type="radio" name="wav-gal-slider-radio-set" class="wav-gal-slider-selector5" />
    <label for="wav-gal-slider-5" class="wav-gal-slider-label-5"></label>


    <label for="wav-gal-slider-1" class="wav-gal-slider-prevnext wav-gal-slideshow-a1"></label>
    <label for="wav-gal-slider-2" class="wav-gal-slider-prevnext wav-gal-slideshow-a2"></label>
    <label for="wav-gal-slider-3" class="wav-gal-slider-prevnext wav-gal-slideshow-a3"></label>
    <label for="wav-gal-slider-4" class="wav-gal-slider-prevnext wav-gal-slideshow-a4"></label>
    <label for="wav-gal-slider-5" class="wav-gal-slider-prevnext wav-gal-slideshow-a5"></label>

    <div class="wav-gal-slider-background">
    <ul class="wav-gal-slides clearfix">
    <li><img src="http://fakeimg.pl/824x392/?text=one" alt="image01" /></li>
    <li><img src="http://fakeimg.pl/824x392/?text=two" alt="image02" /></li>
    <li><img src="http://fakeimg.pl/824x392/?text=three" alt="image03" /></li>
    <li><img src="http://fakeimg.pl/824x392/?text=four" alt="image04" /></li>
    <li><img src="http://fakeimg.pl/824x392/?text=five" alt="image05" /></li>
    </ul>
    </div><!-- wav-gal-slider-background -->

    </div><!-- wav-gal-slider-container -->


    </div>
    </div>

当我上传到我的项目时，如何使prev / next箭头工作？

0 个答案: