모달과 같은 스택 오버플로 플래그 구현

스택 오버플로를 탐색 할 때 뭔가 수정해야했습니다.
그렇게하면서 멋진 디자인의 팝업을 보았고 나는 그것을 뻔뻔하게 포팅했습니다. :)모달과 같은 스택 오버플로 플래그 구현

enter image description here

지금 나는 그와 관련된 모달을하고 싶습니다. 일반 솔루션을 갖고 싶습니다.

이의 jQuery UI 대화 상자가 쉽게 같은 테마 수 있습니다 또는 나는 blockui로 이동한다
내 질문은?
이 스타일을 복사하는 것이 적절하지 않습니까? Stack Overflow에서?

또한 나는 이것을 위해 사용 된 플러그인을 보지 않았습니다. 그들은 자신의 팝업을 구현 했습니까?

업데이트 :

내가 정말 숨기기 폭발 구현하는 싶습니다 jQueryUI 대화 상자를 사용하고 싶습니다.

hide: "explode"

출처

2011-02-04 naveen

jQuery BlockUI로 했나요? 더 나은 구현을 환영합니다

<html> 
<head> 
    <title>Popup Test</title> 
    <style type="text/css"> 
     div{ 
      border: none !important; 
     } 
     .popup { 
      -moz-box-shadow: 2px 2px 5px black; 
      background-color: #FFFFFF; 
      border: 10px solid #AE0000 !important; 
      display: none; 
      padding: 15px; 
      position: absolute; 
      z-index: 1; 
     } 

     .popup-close { 
      position: absolute; 

     } 
     .popup-close a { 
      -moz-border-radius: 25px 25px 25px 25px; 
      -moz-box-shadow: 2px 2px 5px #666666; 
      background-color: #000000; 
      color: #FFFFFF; 
      font-size: 30px; 
      font-weight: bold; 
      left: -34px; 
      padding: 0 7px; 
      position: relative; 
      top: -35px; 
     } 
     a.popup-actions-cancel { 
      color:Blue; 
     } 
     a:hover.popup-actions-cancel { 
      text-decoration: underline; 
     } 
    </style> 

    <script type="text/javascript" src="https://www.google.com/jsapi"> 
    </script> 
    <script type="text/javascript"> 
     google.load("jquery", "1.4.4"); 
     google.load("jqueryui", "1.8.9"); 
    </script> 
    <script type="text/javascript" src="http://github.com/malsup/blockui/raw/master/jquery.blockUI.js?v2.34"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#showpopup").css("text-decoration", "underline"); 
      $("a").css("cursor", "pointer"); 
     }); 
     $(".popup-hide").live("click", function() { 
      $.unblockUI(); 
     }); 
     $("#showpopup").live("click", function() { 
      $.blockUI({ message: $('#popup1') }); 
     }); 
    </script> 
</head> 
<body> 
    <div style="padding-left: 20px; padding-top: 20px;"> 
     <a id="showpopup">Click to Block UI</a> 
    </div> 
    <div id="popup1" class="popup"> 
     <div class="popup-close popup-hide"><a title="close this popup (or hit Esc)">&times;</a></div> 
     <div> 
      Hello world! 
     </div> 
     <div class="popup-actions"> 
      <div style="float:left; margin-top:18px;"> 
       <a class="popup-actions-cancel popup-hide">cancel</a> 
      </div> 
     </div> 
    </div> 
</body> 
</html>

출처

2011-02-04 07:04:53 naveen

이미지와 소스 코드를 복사하지 않는 한 다른 웹 사이트에서 디자인을 복사하는 것이 불법이라고 생각하지 않습니다.

사용자 지정 팝업을 작성하는 대신 jQuery UI를 사용하는 것이 좋습니다.

출처

2011-02-04 05:44:03 Arun

모달과 같은 스택 오버플로 플래그 구현

답변

관련 문제