JQuery Pop Up Box - 오류

나는 JQuery Pop Up Box를 구현하지 못했지만, 제게 지시 할 수 있기를 바랍니다. 나는 아직도 언어에 상당히 새로운이야! 내 코드를 아래에 나타납니다! JQuery Pop Up Box - 오류

/* POPUPSTART CSS */ 
.infocontainer{ 
    display:block; 
    } 

.infoouter{ 
    background-color:#222222; 
    height:100%; 
    width:100%; 
    position:absolute; 
    z-index:9998; 
    float:none; 
    filter: alpha(opacity=50); 
    -moz-opacity: 0.5; 
    -khtml-opacity: 0.5; 
    opacity: 0.5; 
    } 


.infobox{ 
    background-color:#ffffff; 
    border-style: solid; 
    border-width: 5px; 
    border-color: #f3af4e; 
    height:60%; 
    width:80%; 
    position:absolute; 
    left:10%; 
    top:20%; 
    padding:15px; 
    z-index:9999; 
    float:none; 
    } 

.infoimg{ 
    float:left; 
    } 

.infoclose{ 
    float:right; 
    } 

.infotext{ 
    left:10%; 
    right:10%; 
    top:20%; 
    bottom:20%; 
    padding:10%; 
    height:60%; 
    width:80%; 
    text-align:center; 
    position:absolute; 
    } 
/* /POPUPSTART */

// 자바 스크립트 문서

$(document).ready(
function() { 

    $(".infoclose").click(function() { 
     $(".infocontainer").slideRight("slow"); 

    }); 
});

<!-- POP UP HTML --> 
<div class="infocontainer"> 
<div class="infoouter"> 
<!-- BACKGROUND COLOUR --> 
</div><!-- /infoouter --> 
<div class="infobox"> 

<a href="#" class="infoclose"><img class="infoclose" alt="close" src="http://www.doopsdesigns.co.uk/images/socialicons/close.png" width="26" height="26"> 
</a> 
<img class="infoimg" src="#"> 

<div class="infotext"> 
<h1 align="center">HELP JASONS POP UP BOX</h1> 
</div><!-- /infotext --> 

</div><!-- /info box --> 
</div><!-- /infocontainer --> 
<!-- /POP UP -->

가 나는 부하에 표시하지만, 닫기 버튼을 클릭하면 숨길 필요가있다.

나는 모든 것을 제공했으면 좋겠다. 어떤 의견을 보내 주셔서 감사합니다!

Ta, Jason.

출처

2016-10-20 doopsdesigns

JQuery UI의 대화 상자 위젯을 사용할 수 있습니다. documentation here을 확인하십시오. 코드는 다음과 같아야하며 팝업/모달을 직접 닫지 않아도됩니다.

$("div.infocontainer").dialog({ 
    //Add more properties, like modal, closeOnEscape, etc -- refer Documentation 
})

JQuery UI를 사용하면 애니메이션 및 기타 사항을 코드에 추가 할 수 있습니다.

출처

2016-10-20 17:26:48 ash

간단한 jQuery를 위해 당신은

https://jsfiddle.net/6a3o86q7/

데모 여기를 참조하십시오 .hide()

기능 .slideUp() 대신의 .slideRight을 사용할 수 있습니다

출처

2016-10-20 17:30:04 Rohit

JQuery Pop Up Box - 오류

답변

관련 문제