2011-01-31 61 views
1

我有2個div一個div類是「.section」和另一個div類名稱是「more-section-wrapper」和「more-section-wrapper」 「多段報頭」。 ONCLICK更多節頭我正在嘗試調整兩個div的寬度就像下面我嘗試簡單的分離器與jquery但不工作

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

我儘量去除更多的截面,包裝和增加新的類名少形部包裝和我在較小部分的包裝器上點擊寬度調整。

我嘗試做分離器,但點擊。更多部分頭類寬度已調整,但點擊較少部分包裝類後,它不起作用。

請在下面檢查我的代碼。

$(".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中

回答

2

簡單的分路器解決方案是this您嘗試才達到什麼?

Here是動畫版本。

+0

謝謝納爾姆,但如何添加動畫功能。 – Elankeeran 2011-01-31 21:14:15