1. 홈
  2. 질의 응답
  3. 주변 사이트를 희미하게하는 JS 팝업 요소

주변 사이트를 희미하게하는 JS 팝업 요소

2010-07-01 4 views
4

내가 원하는 것을 설명하는 방법을 잘 모르겠지만 이전에 많은 사이트에서 본 적이있을 것이라고 확신합니다.주변 사이트를 희미하게하는 JS 팝업 요소

기본적으로 링크를 클릭하면 일부 텍스트가 포함 된 요소가 표시되고 나머지는 사용자가 포커스를 요소쪽으로 향하게됩니다. 알림이 표시되기 전에 확인이 필요하기 때문에 사용자가 흐리게 표시된 부분을 클릭해서는 안됩니다.

내 사이트에서 jQuery를 사용하고 있기 때문에 사용하기가 쉽습니다.

출처

2010-07-01 Matt

답변

9

jQuery UI의 dialog 위젯은 '모달'모드에서 열 때 '반투명'배경을 사용합니다.

HTML :

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

자바 스크립트 :

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

데모 here

출처

2010-07-01 11:32:48 sje397

0

그것은 종종 "라이트"라고. 난 정말 유연하고 광범위한 브라우저를 지원하는 nyroModal라는 플러그인을 사용합니다.

출처

2010-07-01 11:30:31 patmortech

2

가 콘텐츠를 충당하기 위해 별도의 사업부를 추가합니다. 마스크는 팝업 될 컨트롤을 제외한 모든 요소 위에 위치해야합니다. 아래의 jquery 코드를 사용하면이 기능을 구현할 수 있습니다. = '마스크'

......... 
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

관련 문제

 관련 문제