jQuery .hide()的奇怪问题

时间:2013-06-20 18:14:42

标签: javascript jquery

我正在为客户建立一个网站,但我遇到了jQuery的.hide()函数

的奇怪错误

如果您查看此sample url并点击任何一个缩略图,您会看到图片与左侧对齐。现在,如果您打开或切换到任何其他浏览器选项卡,然后返回到示例网址,图像将居中...

图像应该居中,并且工作得很好,直到我添加它;

$(".single-content-overlay").hide();

到我的脚本文件......

任何人都有任何想法可能会发生这种情况以及我如何解决这个问题?

1 个答案:

答案 0 :(得分:3)

你有CSS的问题(可能是你的幻灯片javascript lib生成的)。当浏览器再次获得焦点时,会重新调整<li>的宽度。这样:

<li class="slide flex-active-slide" style="width: 0px; float: left; display: block;">
    <img alt="#" src="http://www.robotwp.com/clintenglish/wp-content/themes/clintenglish/images/samples/marley.jpg">
</li>
<li class="slide" style="width: 0px; float: left; display: block;">
    <img alt="#" src="http://www.robotwp.com/clintenglish/wp-content/themes/clintenglish/images/samples/marley.jpg">
</li>

成为这个:

<li class="slide flex-active-slide" style="width: 1088px; float: left; display: block;">
    <img alt="#" src="http://www.robotwp.com/clintenglish/wp-content/themes/clintenglish/images/samples/marley.jpg">
</li>
<li class="slide" style="width: 1088px; float: left; display: block;">
    <img alt="#" src="http://www.robotwp.com/clintenglish/wp-content/themes/clintenglish/images/samples/marley.jpg">
</li>

Chrome,Firefox和IExplorer(所有最新版本)都会出现同样的情况。我几乎可以肯定这是一个幻灯片库的问题(或一个功能?)。尝试手动定义<li>的宽度以查看问题是否仍然存在。