html点击按钮时切换图片的代码

发布网友

我来回答

2个回答

热心网友

html点击按钮时切换图片的代码如下:

<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>

<style>

#hello{width:108px;height:108px;border:1px solid #369;overflow:hidden;margin:auto;}

#word{margin:auto;width:136px;}

</style>

<div id="hello">

<img src="http://i1.baidu.com/it/u=2390401277,31827753&fm=203">

<img src="http://i1.baidu.com/it/u=3713675608,2219355047&fm=203">

<img src="http://i2.baidu.com/it/u=695011303,1300693603&fm=203">

</div>

<div>

<input type="button" value="上一张" onclick="a()";>

<input type="button" value="下一张" onclick="b()";>

</div>

<script>

function a(){

$('#hello').find('img').eq(0).appendTo($('#hello'));

}

function b(){

$('#hello').find('img:last').eq(0).prependTo($('#hello'));

}

</script>

HTML超级文本标记语言文档制作不是很复杂,但功能强大,支持不同数据格式的 文件镶入,这也是万维网( WWW)盛行的原因之一,其主要特点如下:

热心网友

<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
<style>
#hello{width:108px;height:108px;border:1px solid #369;overflow:hidden;margin:auto;}
#word{margin:auto;width:136px;}
</style>

<div id="hello">
<img src="http://i1.baidu.com/it/u=2390401277,31827753&fm=203">
<img src="http://i1.baidu.com/it/u=3713675608,2219355047&fm=203">
<img src="http://i2.baidu.com/it/u=695011303,1300693603&fm=203">
</div>

<div>
<input type="button" value="上一张" onclick="a()";>
<input type="button" value="下一张" onclick="b()";>
</div>

<script>
function a(){
    $('#hello').find('img').eq(0).appendTo($('#hello'));
}
function b(){
    $('#hello').find('img:last').eq(0).prependTo($('#hello'));
}

</script>

声明声明:本网页内容为用户发布,旨在传播知识,不代表本网认同其观点,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。E-MAIL:11247931@qq.com