1. 首頁
  2. 問答
  3. JS彈出元素昏暗周圍的網站

JS彈出元素昏暗周圍的網站

2010-07-01 55 views
4

我不太確定如何描述我想要做什麼，但我確定我以前在很多網站上看到過它。JS彈出元素昏暗周圍的網站

基本上，當有人點擊一個鏈接時，它應該顯示一個包含一些文本的元素，並將網站的其餘部分變暗，以便用戶將注意力集中到元素上。它不應該讓用戶點擊模糊區域，因爲通知需要確認才能進行。

我在我的網站上使用jQuery，所以我很樂意使用它，如果它會更容易。

來源

2010-07-01 Matt

回答

9

jQuery UI的dialog小部件將在'模式'模式下打開時使用'半透明'背景。

HTML：

<div id='test' title='test'>Test!</div>

的javascript：

$('#test').dialog({modal: true});

演示here

來源

2010-07-01 11:32:48 sje397

0

它通常被稱爲 「收藏夾」。我使用了一個名爲nyroModal的插件，它非常靈活，並且支持多種瀏覽器。

來源

2010-07-01 11:30:31 patmortech

2

添加一個額外的div來覆蓋內容。蒙版應放置在除彈出控件外的所有元素的頂部。使用下面的jQuery代碼，可以實現這個功能。假設（格）的ID爲新加入的控制=「面具」

......... 
var maskHeight = $(document).height(); 
var maskWidth = $(window).width(); 
//Set heigth and width to mask to fill up the whole screen 
$('#mask').css({'width':maskWidth,'height':maskHeight}); 

//transition effect  
$('#mask').fadeIn(1000);  
$('#mask').fadeTo("slow",0.5); 
......

來源

2010-07-01 12:55:03

相關問題

 相關問題