2012-07-23 62 views
1

我正在使用javascript自定義滾動條,並且我還在交換/滾出該滾動條的內容,唯一的問題是當我切換不同的內容高度保持原來的相同股市不會調整,我不知道爲什麼。Javascript和Css:高度不變

這裏是我的javascript:

$(window).load(function(){ 
(function($) { 
    $.fn.Fader = function() { 
     this.each(function() { 
      $('.clickme').bind('click', function(e) { 
       e.preventDefault(); 
       $("#mediaswap div").fadeOut(); 
       $("#mediaswap div" + $(this).attr('name')).fadeIn(); 
      }) 
     }); 
    } 
})(jQuery); 


$(function() { 
    $('#mediaswap').Fader(); 
}); 
});//]]> 

安迪我的CSS:

#media_scroll{position:absolute; margin:0; width:590px; height:334px;} 
#media_scroll .customScrollBox{position:relative; height:100%; overflow:hidden;} 
#media_scroll .customScrollBox .container{position:relative; width:565px; top:0; float:left;} 
#media_scroll .customScrollBox .content{clear:both;} 
#media_scroll .dragger_container{position:relative; background: url(images/assets/track-bkg.jpg) no-repeat; width:10px; height:324px; float:left; margin:10px 0 0 10px; cursor:pointer;} 
#media_scroll .dragger{position:absolute; width:14px; height:22px; background: url(images/assets/dragger.gif) no-repeat; margin-left:-3px; text-align:center; overflow:hidden; cursor:pointer;} 
#media_scroll .dragger_pressed{position:absolute; width:14px; height:22px; margin-left:-3px; overflow:hidden;} 

DIV的 '內容' 是具有不同的div有其內不同高度的股利。

所有幫助非常感謝!

+1

是淡入()甚至工作?它看起來像選擇器是錯誤的 – Ibu 2012-07-23 23:12:22

+0

我認爲我們需要看到HTML來了解發生了什麼。 – bhamlin 2012-07-23 23:16:42

+0

是的,即使選擇這樣的工作,你沒有'div'和'attr('name')'之間的空格,所以它會一起運行。 – Tyrsius 2012-07-23 23:28:09

回答

1

只需要花在這一個刺,儘管缺乏代碼:

.content,只是要能大小334px爲您設置爲最大height#media_scroll。嘗試使用min-height: 334px;height: auto;,看看是否沒有幫助。你也可以使用jquery來設置尺寸#media_scroll

此外,張貼代碼,將其添加到jsfiddle.net真的幫助我們解決您的問題。

此外,爲了Tyrsuis'點:

$("#mediaswap div" + $(this).attr('name')).fadeIn();

大概應該是更多的東西一樣:

$("#mediaswap div " + $(this).attr('name')).fadeIn();

但是要記住,如果$(this).attr('name')不會添加一個 ''或'#'給選擇器。 所以,你可能最終會試圖調用是這樣的:

$( 「#mediaswap DIV的ElementName」)

代替:

$("#mediaswap div #elementName")