[英]Mutually Exclusive Images
I would like to have a group of images where only one is expanded at a time. 我想要一组图像,一次只能扩展一个。 The others will be shrunken down to 10% their natural size.
其他的将缩小到其自然大小的10%。 Through a click event I would like to be able to select a single image and the other photo that is selected at the time will shrink back to 10%.
通过单击事件,我希望能够选择单个图像,而此时选择的其他照片将缩小到10%。
<script> //To expand an image back to full size
$(document).ready(function(){
$("img").click(function(){
$(this).css("width","100%");
});
});
</script>
Without giving a unique ID to each image and spending lot's of time to shrink back the others, how would I make the image exclusively full size? 如果不给每个图像一个唯一的ID,又不花很多时间缩小其他图像,我将如何使图像完全变大?
For those that would like to see the HTML: 对于那些想看HTML的人:
<div>
<img class="shrink thick-border" src="img/bentley.jpg">
</div>
<div>
<img class="shrink thick-border" src="img/classic.jpg">
</div>
<div>
<img class="shrink thick-border" src="img/ferrari.jpg">
</div>
<div>
<img class="shrink thick-border" src="img/maseratti.jpg">
</div>
Use following: 使用以下内容:
$(document).ready(function(){
$("img").click(function(){
$('img').each(function(){$(this).css('width', '10%');});
$(this).css("width","100%");
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.