2012-07-23 70 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")