JSP页面标签切换

有两个标签,点击两个标签可以自由切换,标签是用图片代替的,初始化是显示第一个标签的内容的,如果点击第二个标签,第一个标签变灰,第二个标签变亮(即显示第二个标签的内容),请问这个效果怎么实现?

这是第一个标签的效果,第一个标签的图片亮,第二个标签图片灰。
[img]http://dl.iteye.com/upload/attachment/0069/4830/072aae95-706d-32a1-bcfa-d739659d2916.jpg[/img]

这是第二个标签的效果!
[img]http://dl.iteye.com/upload/attachment/0069/4832/d998dc8c-b477-33f8-ba12-a0b01464c6ae.jpg[/img]

5个回答

你是不是想做一个tab效果啊?
你只要在点击第二个标签的时候,把第一个标签的样式去除,并把它给第二个标签就可以了。

lw900925
lw900925 谢谢,貌似我已经搞懂了!
8 年多之前 回复

让美工再做一套灰色的图片,单击的时候动态改变图片url

zyn010101
zyn010101 是啊,这是一种思路,还有一种思路,你动态改变图片的滤镜效果
8 年多之前 回复
lw900925
lw900925 请问这种效果怎么实现,就是讲原来灰色的图片替换成亮的图片!
8 年多之前 回复

当点击第二个标签的时候,就隐藏第一个标签的内容,显示第二个标签的内容啊。

就是一个显示隐藏的问题。

这得看美工的了

这个用jQuery来实现很简单的,
1、首先你要准备一个curr的样式,表示当前被选中了。
2、给那2个DOM节点注册点击事件,当点击了就改变按钮的样式。没有选择的就移除样式

下面是具体的实现代码
javascript代码:

$("selectId1").toggle(
  function () {
    $(this).addClass("curr");
  },
  function () {
    $(this).removeClass("curr");
  }
);
$("selectId2").toggle(
          function () {
            $(this).addClass("curr");
          },
          function () {
            $(this).removeClass("curr");
          }
);

html代码:
选帅哥
选美女

这样就可以实现切换的效果了。用jQuery的toogle方法就是专门来出来这样的事件切换的。

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐