0

我做了一个像这样的简单灯箱：

 $(document).ready(function() {
       $(".abc").click(function(event) {
           event.preventDefault();
           var href = $(this).attr("href");
           $(".bucket").load(href);
           $(".overlay").css({"display": "block"});
           $("body").css({"overflow": "hidden"});

       });
       $(".overlay, .close").on('click', function(e) {
           if( e.target !== this ) 
                return;
           $("body").css({"overflow": "visible"});
           $(this).hide(); 
       });
   });

如您所见，我通过应用溢出禁用正文滚动条：隐藏。

灯箱关闭后，我将溢出属性重置为正常。

不知何故，一切都搞砸了。所有字体大小似乎都是随机变化的。

可能是什么问题呢？

这里有一个演示：

点击“ABC”链接查看效果：

http://www.deutsch-lernen.com/DLOneu/learn-german-online/beginners/uebung9_1.php#top

4

2 回答 2

0

当您的灯箱打开时，我相信它包括 alleSeiten.css 并且它正在全局更改锚点和其他样式。这使得它可以更改顶部菜单和其他地方的字体。

您的锚标记的默认样式是：-

a：活动{颜色：继承；显示：块；字体大小：14px；上边距：10px；文字装饰：无；文本转换：大写；宽度：100%；}

对于 alleSeiten.css 它是：-

一个{颜色：#666666；字体系列：Verdana、Arial、Helvetica、sans-serif；字体大小：8pt；字体样式：正常；字体粗细：粗体；行高：正常；}

您需要对 alleSeiten.css 进行更改，使其不会影响页面样式。最终它会覆盖你的 style.css 样式。

于 2013-06-05T10:32:09.240 回答
-1

使用 css() 方法的方式是替换所选元素的整个 css 代码。尝试以下仅更改特定的 css 属性（显示/溢出）：

错误的：

$(".overlay").css({"display": "block"});

正确的：

$('.overlay').css('display', 'block');
于 2013-06-05T10:21:56.070 回答