我尝试使用jquery的简单拆分器但不工作

时间:2011-01-31 16:54:44

标签: javascript jquery jquery-plugins

我有2个div一个div类是“.section”而另一个div类名是“more-section-wrapper”和“more-section-wrapper”,它有一个名为“more-section-header”的标题类。在on-section-header上点击我试着调整两个div的宽度,如下所示

$(".more-sections-wrapper").css("width","20px");
                    $(".sections").css("width","810px");

之后我尝试删除more-sections-wrapper并添加新的类名less-section-wrapper,并在上面调整了less-section-wrapper的宽度调整。

我尝试进行拆分,但是点击.more-section-header类宽度已经调整但是在点击less-section-wrapper类后它不起作用。

请检查下面的代码。

$(".more-section-header").click(function() {
    $(".more-sections-wrapper").css("width","20px");
    $(".sections").css("width","810px");
    $(".more-section-header").removeClass('more-section-header').addClass('less-section-header');
    }).find(".less-section-header").click(function() {
        $(".less-sections-wrapper").css("width","347px");
        $(".sections").css("width","495px");
        $(".less-section-header").removeClass('less-section-header').addClass('more-section-header');
  });

HTML结构如下

           -----------------------------------------------
           |                        |                     |
           |                        |                     |
           |                        |                     |
           |                        |                     |
           |                        |                     |
           ------------------------------------------------

请建议在jquery中实现简单拆分器的解决方案

1 个答案:

答案 0 :(得分:2)

this你想要实现的目标是什么?

Here是动画版。