0

サイトで 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>

どんな助けでも感謝します。皆さんありがとう、

4

2 に答える 2

1

あなたのページへのリンクを提供できますか？

それはきっとあなたの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>
于 2013-05-08T12:23:00.183 に答える
-2

詳細な分析とさまざまな機能の実装により、問題を解決しました

以下のコードは私の問題を解決します。

<!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>
于 2013-05-08T12:29:15.597 に答える