Jquery花哨的弹出框内容点击Blink问题

我在我的网站中使用了jquery花哨的弹出框。我有弹出框的问题。每当我点击弹出框上的内容，弹出框就会闪烁。

下面是我的代码，这是我在我的本地。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script type="text/javascript" src="../lib/jquery-1.7.2.min.js"></script>   
    <script type="text/javascript" src="../source/jquery.fancybox.js"></script>
    <link rel="stylesheet" type="text/css" href="../source/jquery.fancybox.css" media="screen" />
    <style type="text/css">
        .fancybox-custom .fancybox-skin 
        {
            box-shadow: 0 0 50px #222;
        }
    </style>
    <script type="text/javascript">
        $(document).ready(function() {          
                $(".fancybox").fancybox();
        });
    </script>
</head>
<body>
        <div class="fancybox">Test Content</div>    
</body>
</html>

任何帮助，非常感谢。谢谢,

你能提供一个链接到你的页面吗?

这可能是你的box-shadow属性。在一些浏览器中不支持没有前缀，所以删除它或添加-moz和-webkit标记也应该纠正这个问题。

<style type="text/css">
.fancybox-custom .fancybox-skin {
  -webkit-box-shadow: 0 0 50px #222;
  -moz-box-shadow: 0 0 50px #222;            
  box-shadow: 0 0 50px #222;
}
</style>

经过深入分析，我已经解决了我的问题&实现各种功能

下面的代码解决了我的问题。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>fancyBox - Fancy jQuery Lightbox Alternative | Demonstration</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <!-- Add jQuery library -->
    <script type="text/javascript" src="../lib/jquery-1.7.2.min.js"></script>   
    <!-- Add fancyBox main JS and CSS files -->
    <script type="text/javascript" src="../source/jquery.fancybox.js"></script>
    <link rel="stylesheet" type="text/css" href="../source/jquery.fancybox.css" media="screen" />
    <script type="text/javascript">
            $(document).ready(function() {          
                $(".fancybox").fancybox().trigger('click');
             });
    </script>
</head>
<body>
        <h1>fancyBox</h1>
    <a class="fancybox" href="#inline1" style="display:none">Inline</a>
    <div id="inline1" style="width:400px;display: none;">
        <h3>Etiam quis mi eu elit</h3>
        <p>test</p>
    </div>
</body>
</html>

相关内容

最新更新

热门标签：