1

影を落としたい/div id = "test"ダイアログボックスの背景をぼかしたいのですが、jquery ui が提供するクラス .ui-widget-shadow / .ui-widget-overlay を使用してみましたが、正しく動作していないようです。これを達成する方法はありますか?ありがとう。

  <style>
    div {
        display: none;
        width: 90%;
        height: 95%;
        margin-left:5%;
        background: #ccc;
        border: 1px solid #000;
    }

    div img {
        display: inline;
        margin-left:5%;
    }
    </style>
    <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
</head>
<body>

<button>show the div</button>
<div id = 'test'> <img src = 'image.png'></div>

<script>
$( "button" ).click(function() {
    $( "div" ).show( "scale", 180 );
});

$( "#test" ).dblclick(function() {
    $( "#test" ).hide( "scale", 200 );
});

</script>
4

1 に答える 1

4

あなたは関連することを何もしていません!

に が必要な場合drop-shadow#test、次の CSS を使用できます。

#test {box-shadow: 10px 10px 5px #000;}

多くのオンラインbox-shadowジェネレーターを使用してコードを生成できます。

それ以外の場合は、背景を非表示にしたりぼかしたりするモーダル ウィンドウのようなものが必要な場合は、別のウィンドウを追加しdivて指定する必要がありますz-index。詳細については、Simple jQuery Modal Window Tutorialを参照してください。

于 2012-12-09T17:23:11.733 に答える