使用jquery响应导航栏

问题描述：

我有一个导航栏，我想作出响应...当用户调整窗口大小小于特定值时，<a>标记的填充应相应更改以适应所有<li>当前窗口宽度内的元素...这里是我的jsfiddle 在我的例子中，如果我们使widow的宽度小于390px，最后一个元素下来了...我想这样做，当用户去调整窗口的宽度时，比390px，元素应该开始变小，可能是通过改变它们的左侧和右侧填充.... ，以便它会变得响应...我正在使用jQuery .... 我该如何实现这一目标？使用jquery响应导航栏

请张贴您的问题代码，jsfiddle链接将得到downvoted：http://meta.stackexchange.com/questions/84342/answer-that-only-contains-a-link-to-jsfiddle – Lowkase 2013-04-04 18:36:14

我只有html标签和CSS ...并使用jsfiddle我可以告诉你我在做什么 – 2013-04-04 18:38:36

@vikasdevde我们希望你在你的帖子中发布代码的原因是这样很容易看到，未来的访问者将能够访问它。您仍然可以将JSFiddle作为补充发布。 – 2013-04-04 18:40:19

答

在你的CSS使用媒体查询，jQuery是没有必要在这种情况下：

http://jsfiddle.net/5kNgy/2/

@media only screen and (min-width:0px) and (max-width:390px) {   
    .hor-menu ul li a {padding:2px;} 
}

谢谢... Lowkase ...但有没有一种方法使用jQuery，我们可以做一个平滑的转换 – 2013-04-04 18:41:45

Vikas，你应该看看Twitter Boostrap。 http://twitter.github.com/bootstrap/scaffolding.html#responsive你可能最终在这里重新发明*......只是一个想法。 – 2013-04-04 18:47:41

谢谢@ Moby'sStuntDouble – 2013-04-04 18:49:06

答

@media (max-width: 390px) 
{ 
    .hor-menu ul li a { padding: 0 0 0 0 !important; } 
}

我觉得这是你试图做什么？

使用jquery响应导航栏

相关推荐