인트로샘플

카테고리 없음 2017. 11. 22. 20:38 |

인트로샘플

 

http://www.amerigotour.com/test_intro/index.html

:

메인 슬라이드

카테고리 없음 2017. 11. 21. 15:25 |

메인 슬라이드

 

http://www.yeintour.com/ms_test/test.htm

 

http://pgwjs.com/pgwslider/

:

div show hide 숨기고 보이기

카테고리 없음 2017. 11. 15. 13:52 |

div show hide 숨기고 보이기

 

previewcopy to clipboardprint?
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
  2. <HTML>  
  3.  <HEAD>  
  4.   <TITLE> New Document </TITLE>  
  5.   <script>  
  6.   function show1(){  
  7.   document.getElementById('div1').style.display ='block';  
  8.     document.getElementById('div2').style.display = 'none';  
  9. }  
  10. function show2(){  
  11.   document.getElementById('div1').style.display = 'none';  
  12.   document.getElementById('div2').style.display ='block';  
  13. }  
  14.   </script>  
  15.  </HEAD>  
  16.   
  17.  <BODY>  
  18.   
  19.  <div style="margin:50px auto 0 auto; border:1px solid #ccc; width:80%; padding:15px ">  
  20.   <p>당신이 조만간 가게될 여행은 무엇입니까? -- 순수 스크립트 형태 ie7 동작</p>  
  21. <input type="radio" name="tab" value="igotnone" onclick="show1();" />  
  22. 허니문  
  23. <input type="radio" name="tab" value="igottwo" onclick="show2();" />  
  24. 가족여행  
  25. <div id="div1" style="display:none">  
  26.   <hr style="border:0; border-bottom:1px solid #ebebeb; background:#fff"><p>허니문을 가게된다면, 좋아하는 지역은?</p>  
  27. <input type="checkbox" value="Yes" name="one">  
  28. 태국 &nbsp;  
  29. <input type="checkbox" value="Yes" name="two">  
  30. 발리  
  31. </div>  
  32.   
  33. <div id="div2"  style="display:none">  
  34.   <hr style="border:0; border-bottom:1px solid #ebebeb; background:#fff"><p>가족여행은 누구랑 가게됩니까?</p>  
  35. <input type="checkbox" value="Yes" name="one">  
  36. 부모님 &nbsp;  
  37. <input type="checkbox" value="Yes" name="two">  
  38. 아내와 아이들  
  39.   
  40. </div>  
  41.   
  42. </div>  
  43.   
  44. <div style="margin:50px auto 0 auto; border:1px solid #ccc; width:80%;  padding:15px ">  
  45. <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>  
  46.   <script>  
  47.   $(document).ready(function(){  
  48. $("input[name='test']").click(function () {  
  49.     $('#show-me').css('display', ($(this).val() === 'a') ? 'block':'none');  
  50.     $('#show-me2').css('display', ($(this).val() === 'b') ? 'block':'none');  
  51.     $('#show-me3').css('display', ($(this).val() === 'c') ? 'block':'none');  
  52. });  
  53. });  
  54.   </script>  
  55. <p>좋아하는 색상은 무엇입니까? -- JQUERY형태</p>  
  56.     <input name='test' type='radio' value="a" />빨간색  
  57.     <br />  
  58.     <input name='test' type='radio' value="b" />노란색  
  59.     <br />  
  60.     <input name='test' type='radio' value="c" />파란색  
  61.   
  62. <div id='show-me' style='display:none'><hr style="border:0; border-bottom:1px solid red; background:#fff">빨간색을 좋아하시는군요</div>  
  63. <div id='show-me2' style='display:none'><hr style="border:0; border-bottom:1px solid yellow; background:#fff">저도 노란색을 좋아합니다.</div>  
  64. <div id='show-me3' style='display:none'><hr style="border:0; border-bottom:1px solid blue; background:#fff">파란색은 역시 시원한 느낌을 주죠 ^^</div>  
  65. </div>  
  66.  </BODY>  
  67. </HTML>  

:

티스토리툴바