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-shadowfor #test，那么你可以使用这个 CSS：

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

您可以使用许多在线box-shadow生成器生成代码。

否则，如果您需要模态窗口之类的东西，它会隐藏或模糊背景，您需要添加另一个div和 givez-index等。您可以从：Simple jQuery Modal Window Tutorial中查看更多信息。

于 2012-12-09T17:23:11.733 回答