javascript - Jquery - 试图隐藏和显示一堆图像

标签 javascript jquery html css

我的 jquery 代码有点问题。我是 Jquery 的新手,所以请帮助我改进我的代码。好吧,我正在尝试隐藏和显示这 4 张图片。让我详细说明一下:

  1. 我创建了这 4 张图片(并排放置)
  2. 当一个点击时它应该展开并隐藏另一个
  3. 当展开的点击它应该返回到它的正常尺寸并显示另一个
  4. 然后应该重复

我的代码似乎在第一次运行时运行正常,但在第二次运行时却搞砸了(图像的行为与我预想的不一样)

这是我的代码: http://codepen.io/sallyiee/pen/onkKs

最佳答案

您可以使用toggleClasstoggle 方法简化您的代码:

$(".showcase" ).on("click", "img", function(e) {
    $(this).toggleClass("expand");
    $(this).siblings().toggle("fast"); 
});

演示:http://codepen.io/anon/pen/mlBEI

关于javascript - Jquery - 试图隐藏和显示一堆图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24465387/

相关文章:

javascript - React Native 错误找不到模块 'metro-config/src/defaults/blacklist'

Javascript 函数/未定义错误 - 小费计算

javascript - 在 Jquery 中自动格式化电话号码

javascript - 如何在 PDF 文档之前显示加载屏幕

javascript - 如何获取数组中所有重复项的总和?

Javascript Todolist 类别 if else 语句

JQuery UI - slider

php - 联系表单中的 From 字段和 mail() 函数存在问题

html - 尽管渲染了带有图像 url 的背景,但浏览器未渲染背景图像

javascript - 使用 jquery/javascript 查找包含标题的 csv 文件