Javascript 刷新时加载一秒钟所有Jquery选项卡的内容
我使用Jquery搜索标签,一切正常,除了在网站上刷新所有标签的内容显示一秒钟,然后一切恢复正常。 到底是什么问题?我就是认不出来 这是我的密码:Javascript 刷新时加载一秒钟所有Jquery选项卡的内容,javascript,jquery,html,css,jquery-ui,Javascript,Jquery,Html,Css,Jquery Ui,我使用Jquery搜索标签,一切正常,除了在网站上刷新所有标签的内容显示一秒钟,然后一切恢复正常。 到底是什么问题?我就是认不出来 这是我的密码: <html> <head> <link rel="stylesheet" type="text/css" href="../mechanics/segments_container.css"/> <script src="//code.jquery.com/jquery-1.10.2.js">&l
<html>
<head>
<link rel="stylesheet" type="text/css" href="../mechanics/segments_container.css"/>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
$(function() {
$("#tabs").tabs({
activate: function(event, ui) {
window.location.hash = ui.newPanel.attr('id');
}
});
});
</script>
</head>
<body>
<div id="tabs">
<div class ="forum_switch_buttons_wrap">
<ul style = "display:inline;">
<li style = "list-style-type: none;"><a class = "forum_switch_buttons" href="#General">General</a></li>
<li style = "list-style-type: none;"><a class = "forum_switch_buttons" href="#Gaming">Gaming</a></li>
<li style = "list-style-type: none;"><a class = "forum_switch_buttons" href="#Computing">Computing</a></li>
<li style = "list-style-type: none;"><a class = "forum_switch_buttons" href="#Graphics">Graphics</a></li>
<li style = "list-style-type: none;"><a class = "forum_switch_buttons" href="#Coding">Coding</a></li>
<li style = "list-style-type: none;"><a class = "forum_switch_buttons" href="#Market">Market</a></li>
<li style = "list-style-type: none;"><a class = "forum_switch_buttons" href="#Groups">Groups</a></li>
<li style = "list-style-type: none;"><a class = "forum_switch_buttons" href="#Premium">Premium</a></li>
<li style = "list-style-type: none;"><a class = "forum_switch_buttons" href="#Archive">Archive</a></li>
</ul>
</div>
<div class = "forum_wrap">
<div class = "forum_change_height_left">
<div class = "forum_container_left" style = "display:block;" >
<div class = "titlebar">
Forum
</div>
<div class = "forum_inner_container">
<div id="General">
General Content
</div>
<div id="Gaming">
Gaming Content
</div>
<div id="Computing">
Computing Content
</div>
<div id="Graphics">
Graphic Content
</div>
<div id="Coding">
Coding Content
</div>
<div id="Market">
Market Content
</div>
<div id="Groups">
Group Content
</div>
<div id="Premium">
Premium Content
</div>
<div id="Archive">
Archive Content
</div>
</div>
</div>
</div>
<div class = "forum_change_height_right">
<div class = "forum_container_right">
<div class = "titlebar">
Latest Posts
</div>
<div class = "forum_inner_container">
testtest
</div>
</div>
</div>
</div>
</div>
</body>
</html>
$(函数(){
$(“#制表符”)。制表符({
激活:功能(事件、用户界面){
window.location.hash=ui.newPanel.attr('id');
}
});
});
论坛
一般内容
游戏内容
计算内容
图形内容
编码内容
市场含量
组内容
优质内容
存档内容
最新帖子
测试
应用css隐藏内容
发生的事情是,直到整个dom都准备好了,脚本才会启动,所以你会得到一个“未格式化内容的闪光”
一个简单的css修复程序:
.forum_inner_container > div{
display:none
}
.forum_inner_container > div:first-child{
display:block
}
如果您在其他没有选项卡的页面上使用相同的类
论坛\内部\容器
,只需给每个选项卡内容元素一个公共类,并相应地调整上面的规则您能再解释一下吗?:)我在JS方面不是最好的/@samir$(function(){})
与$(document.ready()
So$(document.ready()不起作用?因为我正在努力将它粘贴到代码中有意义的地方,但我就是无法让它工作/