본문 바로가기

웹사이트 만들기/JQuery3

레이어 팝업과 윈도우 팝업 만드는 html과 css 그리고 스크립트 레이어 팝업과 윈도우 팝업을 만들어 봅니다. html 닫기 CSS /* 레이어 팝업 */ #layer {display: none; position: fixed; left: 50px; top: 50px; width: 700px; border: 10px solid #dceff7; box-shadow: 3px 3px 10px rgba(0,0,0,0.4);} #layer img {width: 100%; display: block;} #layer .close {position: absolute; right: 20px; top: 20px; background: #0093bd; padding: 1px 6px; color: #fff;} #layer .close:hover {text-decoration: underlin.. 2019. 12. 27.
[사이트 추천] 제이쿼리로 배너를 만들고 싶을 땐? Slick! 슬릭(slick)이라는 사이트를 이용하여 손 쉽게 배너를 만들 수 있습니다. https://kenwheeler.github.io/slick/ slick - the last carousel you'll ever need slick is a responsive carousel jQuery plugin that supports multiple breakpoints, CSS3 transitions, touch events/swiping & much more! kenwheeler.github.io 위의 사이트로 들어갑니다. get it now 버튼을 클릭하여 css파일과 js 파일을 다운로드 합니다. 이를 html 파일에 연동 시킨 후 slick 에서 요구하는 방식대로 Markup을 진행합니다. 그리고 스크립트를.. 2019. 12. 25.
특정 버튼을 클릭 했을 때 무언가를 나타나게 하는 제이쿼리 코드 다음의 코드는 특정 버튼을 클릭 했을 때 무언가를 나타나게 하는 제이쿼리 코드 입니다. //버튼을 클릭하면 전체 메뉴를 보이게 하세요. $(".tit .btn").click(function(e){ e.preventDefault(); //$("#cont_nav").css("display","block") //$("#cont_nav").show(); //$("#cont_nav").fadeIn(); //$("#cont_nav").slideDown(); //$("#cont_nav").toggle(); //$("#cont_nav").fadeToggle(); //$("#cont_nav").slideToggle(300); //$(this).toggleClass("on"); }); 2019. 12. 24.