gpt4 book ai didi

javascript - 当我点击 BxSlider 的链接时,如何更改图像?

转载 作者:行者123 更新时间:2023-12-03 06:11:20 24 4
gpt4 key购买 nike

我使用 jQuery 插件,BxSlider 。我想展示这部分,我的意思是图像,

<li id="miori"><img src="http://images.ciatr.jp/2015/12/09202601/05c36a2c5ba65065ac4f2a6f6c75b3e1_55.jpeg"></li>

当我点击以下部分时。

<dd id="miori"><a href="">miori</a></dd>

我应该如何为该 Action 编写 JavaScript 代码?您能给我一些建议吗?

<html>
<head>
<title>bxslider</title>
<link href="/jquery.bxslider/jquery.bxslider.css" rel="stylesheet" />
</head>
<body>

<dl class="sample">
<dt>menu</dt>
<dd id="tao"><a href="">tao</a></dd>
<dd id="miori"><a href="">miori</a></dd>
</dl> <!-- sample -->

<ul class="bxslider">
<li id="tao"><img src="http://koi-navi.net/wp-content/uploads/2015/10/5e9dd24e-e1444440113499.jpg"> </li>
<li id="miori"><img src="http://images.ciatr.jp/2015/12/09202601/05c36a2c5ba65065ac4f2a6f6c75b3e1_55.jpeg"></li>
</ul> <!-- bxslider -->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="/jquery.bxslider/jquery.bxslider.min.js" type="text/javascript" ></script>}
<script type="text/javascript">
$(document).ready(function(){
$('.bxslider').bxSlider();
$('dd#miori').on('click', function(){
alert("hello"); // what should I write here?
});
});
</script>

</body>
</html>

最佳答案

引用此:http://bxslider.com/examples/thumbnail-pager-1

试试这个:

<html>
<head>
<title>bxslider</title>
<link href="/jquery.bxslider/jquery.bxslider.css" rel="stylesheet" />
</head>
<body>

<!-- <dl class="sample">
<dt>menu</dt>
<dd id="tao"><a href="">tao</a></dd>
<dd id="miori"><a href="">miori</a></dd>
</dl> <!-- sample -->
<div id="bx-pager">
<a data-slide-index="0" href="">tao</a>
<a data-slide-index="1" href="">miori</a>
</div>
<ul class="bxslider">
<li id="tao"><img src="http://koi-navi.net/wp-content/uploads/2015/10/5e9dd24e-e1444440113499.jpg"> </li>
<li id="miori"><img src="http://images.ciatr.jp/2015/12/09202601/05c36a2c5ba65065ac4f2a6f6c75b3e1_55.jpeg"></li>
</ul> <!-- bxslider -->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="/jquery.bxslider/jquery.bxslider.min.js" type="text/javascript" ></script>}
<script type="text/javascript">
$(document).ready(function () {
$('.bxslider').bxSlider({pagerCustom: '#bx-pager'});
/*$('dd#miori').on('click', function () {
alert("hello"); // what should I write here?
});*/
});
</script>

</body>
</html>

关于javascript - 当我点击 BxSlider 的链接时,如何更改图像?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39303520/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com