我有这种情况，我想根据点击值调用某个元素。当链接包含我想要显示图像的图像时，否则我想加载一个html页面。当加载html页面时，我已经设置了关闭整个事物的样式，就像加载了图像一样。假设我有这个css（这是加载html页面时的样式）
#shadow,#shadowRoute { position:fixed;left:0;top:0;width:100%;height:100%;z-index:500;background:black;opacity:0.8; }
#shadowContent,#shadowContentRoute { position:fixed;z-index:550;background:white;padding:25px; }
#closebar,#closebarRoute { text-align:right;background:#ebdfd3;width:740px;padding:5px;height:25px;text-transform:uppercase; }
#content,#contentRoute { margin-top:25px;width:750px;height:450px;overflow:auto; }
#imageSelectPrevious { position:absolute;left:0;top:45px;width:80px;z-index:600; }
#imageSelectNext { position:absolute;right:0;top:45px;width:80px;z-index:600; }
.imageNavLink { display:block;text-indent:-9999px; }
我使用以下代码显示加载图像。这非常合适，除了关闭栏的样式为背景颜色，在样式表中定义。
$("#shadow").add($("#shadowContent")).fadeIn(500);
$("#shadowContent").animate({width:'250px',height:'250px'},500).css({top:'25px',left:'50%',margin:'0 0 0 -125px',padding:'10px !important'}).empty().append('<div id="closebar"><a href="#close" id="closeBox">'+closeText+'</a></div>').append('<div id="content"></div>');
$("#closebar").animate({width:'250px'},500).css({background:'white !important',padding:'5px 0 !important'});
$("#closebar a").css({color:'#323232','font-weight':'bold',background:'url(http://www.cherrytrees.nl/tmp/Core/Images/closeIcon.jpg) left center no-repeat',padding:'0 0 0 20px'});
$("#content").animate({width:'230px',height:'230px'},500).css({margin:'0',padding:'90px'}).html("<div id='imageSelectPrevious'><a href='#' id='prevImageLink' class='imageNavLink' title='' rel='prev'>Previous</a></div><div id='imageSelectNext'><a href='#' id='nextImageLink' class='imageNavLink' title='' rel='next'>Next</a></div><img id='popImageContainer' src='http://www.cherrytrees.nl/tmp/Core/Images/load.gif' style='margin:0'></div>");
$("#prevImageLink").add($("#nextImageLink")).hide();
好的，我现在有一些代码可以检查图像，获取尺寸和所有内容。当图像完全加载时，我运行以下代码来更改容器尺寸并显示图像
$("#shadowContent").animate({width:newWidth+'px',height:newHeight+'px'},500).css({top:'25px',left:'50%',margin:'0 0 0 -'+(newWidth / 2)+'px !important'});
$("#content").animate({width:newWidth+'px',height:newHeight+'px'},500).css({margin:'0',padding:'0 !important'});
$("#closebar").animate({width:newWidth+'px'},500);
$("#popImageContainer").css({padding:'0 !important'});
现在这在Chrome和Safari（IE未经测试）中工作正常，但Firefox使用#ebdfd3背景设置关闭栏的样式，不知何故为图像添加了填充，并弄乱了容器元素的位置。 / p>
是的，样式表包含在上面我的文档中的javascript
我真的不知道该做什么，考虑到它在Chrome和Safari中的作用。有没有人听说过这样的问题？
问题解决了！
!important导致了这个问题！它现在工作正常!!谢谢！
答案 0 :(得分：2)
不要使用!important：它不会在这种情况下起作用。