채택완료

클릭하면 나오는거 문의드립니다

2017-05-27 (토) 23:22:07 4,676

아래 이미지중 하나를 누를시 그 아래 이미지 처럼 아래에 공간이 나오는 효과를

사용하고싶은데요.. 소스가 있을까요 ㅠㅠ

8b5acb83df0186913dd333cbfa1dfb0c_1495894896_425.png
8b5acb83df0186913dd333cbfa1dfb0c_1495894898_747.png
 

|

답변 3개 / 댓글 3개

채택된 답변
+20 포인트

<style type="text/css">

    .hidden { display:none; }

</style>

<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>

<script type="text/javascript">

    $(document).ready(function () {

       

        $("#btn").click( function () {

            $("#myToggle").toggleClass("hidden");

        });

    });

</script>

<input id="btn" type="button" value="toggle 버튼">

<div id="myToggle" style="background-color:Yellow;">

hello!!

</div>

이걸 응용해 보세요.

답변에 대한 댓글 1개

http://koreacredit.kr/m/sub0101.php

감사합니다 잘되네요 ㅎ 근데 처음부터 오픈이 아니라 처음에는 닫힘 상태로 하고싶은데 어떻게 해야할까요??

<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script> 

<script type="text/javascript">

    $(document).ready(function () {     

    $("#btn").click(function () {  

    if($("#myToggle").css("display") == "none"){   

        $('#myToggle').show();  

    } else {  

        $('#myToggle').hide();  

    }  

}); 

    });

</script>

<input id="btn" type="button" value="toggle 버튼">

<div id="myToggle" style="background-color:Yellow; display:none;">

hello!!

</div>

이렇게 하면 처음에 안보일겁니다.

<input type="radio" name="wr_1" id="wr_1" value="1" onclick="div_OnOff(this.value,'date_con');" <?php if($write[wr_1]=="1") echo"checked";?>> 대출신청<br>

            <input type="radio" name="wr_1" id="wr_1" value="2" onclick="div_OnOff(this.value,'date_con');" <?php if($write[wr_1]=="2") echo"checked";?>> 상세보기 

                  <?php

                  if($write[wr_1] =="2") { 

                  ?>

                  <div id="date_con" style="display:">

                  <? } else { ?>

                  <div id="date_con" style="display:none">

                  <? } ?>

                 --  보여줄 내용 --                  

                  </div>

<script>

function div_OnOff(v,id){

 // 라디오 버튼 value 값 조건 비교

 if(v == "2"){

  document.getElementById(id).style.display = ""; // 보여줌

 }else{

  document.getElementById(id).style.display = "none"; // 숨김

 }

}

</script>  

이런식으로 하시면 될 듯...

답변에 대한 댓글 2개

koreacredit.kr/m

위 주소의 대출상품소개 부분인데요

저게 대출신청, 상세보기가 각자 버튼이 아니라 그냥 한 이미지 통이라 그거 어디를 눌르든 그냥 나오게 하려고 하는데요 그럼 소스가 어떻게 될까요 죄송합니다.. ㅠㅠ
누르면 내용이 나오고 다시 누르면 없어져야하고 또한 누른상태에서 다른걸 누를경우 들어가고 다른게 내려와야 하거든요... ㅠ

답변을 작성하려면 로그인이 필요합니다.