gpt4 book ai didi

jquery - 动态添加图片到div

转载 作者:太空宇宙 更新时间:2023-11-04 00:02:02 24 4
gpt4 key购买 nike

我在页面上有一个图像,点击图像我想检查它的 alt 值,然后相应地添加到类中。例如,如果我点击 alt 值为 4 的图像,那么 1、2、3 图像应该进入上层,而 5、7、8 应该进入下层。

如何实现这个..

<html lang="en">
<head>
<meta charset="utf-8" />
<title>ImageFlow</title>
<meta name="robots" content="index, follow, noarchive" />
<link rel="stylesheet" href="style.css" type="text/css" />

<!-- This includes the ImageFlow CSS and JavaScript -->
<link rel="stylesheet" href="imageflow.packedfunct2.css" type="text/css" />
<script type="text/javascript" src="imageflow.packed.js"></script>
<script type="text/javascript" src="jquery.js"></script>


<script type="text/javascript">

$(document).ready(function () {
$("img").click(function(){
var pos=$('img', this).attr('alt');
alert('i am imageFlip'+this.alt);
console.log('i am Image Flip');
('$this').addClass('t1');
});
});

</script>


</head>
<body style="background-image:url('img2/Mesh2.png');background-repeat:no-repeat; background-size: cover; width=:'100%'">
<h1>Sample For Image Slider</h1>




<!-- This is all the XHTML ImageFlow needs -->
<div id="myImageFlow" class="imageflow">

<img src="img2/thumb1.jpg" longdesc="" width="300" height="360" alt="1" />
<img src="img2/thumb2.jpg" longdesc="" width="300" height="360" alt="2" />
<img src="img2/thumb3.jpg" longdesc="" width="300" height="360" alt="3" />
<img src="img2/thumb4.jpg" longdesc="" width="300" height="360" alt="4" />
<img src="img2/thumb5.jpg" longdesc="" width="300" height="360" alt="5" />
<img src="img2/thumb6.jpg" longdesc="" width="300" height="360" alt="6" />
<img src="img2/thumb7.jpg" longdesc="" width="300" height="360" alt="7" />
<img src="img2/thumb8.jpg" longdesc="" width="300" height="360" alt="8" />
<img src="img2/thumb9.jpg" longdesc="" width="300" height="360" alt="9" />
<img src="img2/thumb10.jpg" longdesc="" width="300" height="360" alt="10" />
<img src="img2/thumb11.jpg" longdesc="" width="300" height="360" alt="11" />
<img src="img2/thumb1.jpg" longdesc="" width="300" height="360" alt="12" />
<img src="img2/thumb2.jpg" longdesc="" width="300" height="360" alt="13" />
<img src="img2/thumb3.jpg" longdesc="" width="300" height="360" alt="14" />
<img src="img2/thumb4.jpg" longdesc="" width="300" height="360" alt="15" />
</div>

</body>

感谢和问候,

最佳答案

如果我接受得好,你需要这样的东西

$(document).ready(function () {
$("img").click( function() {
var t = $(this);
t.prevAll().removeClass('lower').addClass('upper');
t.nextAll().removeClass('upper').addClass('lower');
})
})

关于jquery - 动态添加图片到div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16331641/

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