我确信以前有人问过这个问题,但是我尝试了其他一些答案,但到目前为止都没有。另外,这是一个两部分的问题。
1. 我需要在我的 jquery 图像轮播中插入一个后退箭头和下一个箭头。
这是当前链接的链接:http ://www.bmww.com/clients/index3/casestudies/cabrini_casestudy.html
即使插入了箭头,我也需要数字保持与图像相关的突出显示。我宁愿不改变过渡效果,除非由于某种原因我无法实现这一点。以下是我的代码,但如果您需要其他任何内容来回答我的问题,请告诉我。
这是我的html代码:
<div align="center" class="slideshow" style="height:500px; float:none">
<ul style="margin-top:-30px">
<li><img src="images/cabrini_1.png" alt="lemon" /></li><!--MUST ALWAYS HAVE THIS HERE AND BE THE SAME IMAGE AS NEXT IMAGE-->
<li><img src="images/cabrini_1.png" alt="lemon tea" /></li>
<li><img src="images/cabrini_2.png" alt="splashing lemon" /></li>
<li><img src="images/cabrini_3.png" alt="salad with lemon" /></li>
<li><img src="images/cabrini_4.png" alt="lemonade!" /></li>
<li><img src="images/cabrini_5.png" alt="sliced lemon" /></li>
<li><img src="images/cabrini_6.png" alt="dripping lemon" /></li>
</ul>
</div>
<div id="casenumbers" align="right" style="margin-right:10px">
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(0); return false"></a><!--MUST ALWAYS HAVE THIS HERE AND BE THE SAME IMAGE AS NEXT IMAGE BUT ALWAYS KEEP HIDDEN-->
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(1); return false">1</a>
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(2); return false">2</a>
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(3); return false">3</a>
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(4); return false">4</a>
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(5); return false">5</a>
<a href="#" class="change_link" onclick="$('.slideshow').blinds_change(6); return false">6</a>
<a href="cabrini_casestudy2.html" class="ex1" > » </a>
</div> <!--end slideshow div-->
这是我的 CSS 代码:
<style>
a{color: #666335;}
a.clicked{ color: #D85D27;}
</style>
和我的脚本:
<script type="text/javascript">
$(window).load(function () {
$('.slideshow').blinds();
})
$(document).ready(function(){
$('a.change_link').click(function(){
$('.clicked').removeClass('clicked');
$(this).addClass('clicked');
});
})
</script>
2. 我不知道当您单击示例链接时大家是否都看到它,但有时当我这样做时,会弹出一个奇怪的滚动条,并且整个图像列表会在所有内容加载之前显示一瞬间。有没有我可以添加的代码块或者会出现一个旋转的轮子,所以在完全正确加载之前它不会显示?
提前谢谢大家!!抱歉,我还在学习,所以我知道这似乎是一个简单或荒谬的问题。