본문 바로가기

전체 글

(119)
210313 click할 때 메뉴 보이기, 숨기기 jquery toggle 사용 $('#show_search').toggle( function(){ $('#hd_sub').show(); }, function(){ $('#hd_sub').hide(); } );
210313 워드프레스 SSL https 리다이렉트 카페24 에서 호스팅 받은 계정에 ZEROSSL에서 무료 SSL을 받아 설치해봤다. 설치 하기 전에 해당 호스팅에는 워드프레스가 설치되어 있었는데 주소 리다이렉트를 설정해도 계속 안 되는 거다. 그래서 워드프레스를 삭제하고 보니 .htaccess 파일 내용 수정에 따라 주소창에 https 없이 주소 입력해도 https 가 붙는다. 참고 : siane.tistory.com/234 cafe24 SSL 적용 후 https로 리다이렉트 시키기 어쩌다 보니 회사 사이트를 관리하게 되었다. 내 분야도 아닌데.. 회사 사이트에는 그 흔한 SSL적용도 되어있지 않은 터라, SSL적용부터 했어야 했다. 일단 비용이 들지 않는 let's encrypt를 사용해서 siane.tistory.com 그러니까 호스팅 자체에는 잘..
210304 CSS position 부모, 자식 요소 부모는 position: relative 자식은 position: absolute 로 잡으면 자식 요소가 부모 요소에 맞춰서 모양을 잡는다.
210219 상단 메뉴 스크롤에 따라 배경색 줬다가 투명하게 원래는 투명한 상단 메뉴를 스크롤바 내리면 배경색 줘서 메뉴 텍스트 잘 보이게 했다가 다시 상단 꼭대기로 돌아오면 투명하게 바뀌도록 하기. HTML 상단 메뉴 내용 CSS #hd_wrapper {width:100%;height:120px;} JS : jquery-ui.js 파일 import 필요! $(document).ready(function() { cnt=0; $(document).scroll(function() { cnt = $(this).scrollTop(); if (cnt> 210) { //1 배경색 노 투명 $('#hd_wrapper').stop().animate({'background-color':'#fff'},50); //2 : 배경색 투명도 주기 $('#hd_wrapper').stop()..
210201 jquery not this EX1) ul li 로 만든 리스트에서 swipeleft 했을 때 해당 li의 자식 요소인 del 클래스를 보여주고 그 외의 다른 li의 del 클래스는 숨김 $("li").on("swipeleft",function(){ $(this).children('.del').show(); $('li').not(this).children('.del').hide(); }); EX2) 래디오 버튼 클릭 했을 때, 클릭한 래디오 버튼 제외한 나머지는 체크 해제 attr = $('input:radio'); attr.on('change', function() { attr.not(this).prop('checked',false); });
210201 최신 버전의 jquery 언제나 최신 버전의 jquery를 사용하기.
210119 워드프레스 관리자 아이디, 비밀번호 깜빡했을 때 phpmyadmin 접속 와우 워드프레스 설치하고 관리자 메뉴 들어가보려고 했는데 아이디도 기억이 안나고 비밀번호도 기억이 안났다. 당황.. 5분 전에 한 건데요. 로그인 화면에 비밀번호를 잊으셨나요? 메뉴가 있어서 이메일 기입하고 기다리는데 메일이 안온다. 결국 직접 db에 접속한다. php의 데이터 관리 짝꿍은 mysql 이기 때문에 대부분 phpmyadmin 이라고 하는 온라인 프로그램을 통해 데이터베이스를 관리한다. 그래서 phpmyadmin 을 찾아 들어가 로그인 정보가 담겨 있는 테이블을 찾아 직접 비밀번호를 변경해 주면 된다. phpmyadmin 접속 예) 닷홈 로그인 -> 우측 상단 마이닷홈 클릭 -> 리스트에서 호스팅 선택 -> 상세 보기 클릭 -> 쭈욱 내려가면 제공 내역 이라는 메뉴 내용 중에 MySQL 관리..
210119 워드프레스 설치 헬로. 오늘은 워드프레스를 설치해 볼 것이다. 몇 년만에 처음해본다. 설치를 해보는 이유는 블로그 방문자가 줄었다.. 하루에 20~30명은 왔었는데 저 마스코트 이미지를 넣기 시작한 날부터 확 줄었다ㅎ.. 우연이겠지.. 일희일비 하는 삶.. 그래서 워드프레스가 아직 인기가 좋은지 모르겠지만 방문자를 늘려보고자 셀프 설치를 해본다. 정말 쉽습니다! 내 기준 가장 어려운 건 다운로드 페이지 찾기 같다. 구글에 워드프레스 쳐서 들어가면 어림도 없다. 워드프레스 메인부터 시작하면 절대 못 찾는다. 그냥 아예 구글에 wordpress download 라고 쳐서 바로 다운로드 페이지로 들어가야 한다. 방문자수 늘려야 하니까 여기에도 다운로드 페이지 링크 : ko.wordpress.org/download/ Downl..
210114 jquery 메뉴에 마우스를 올렸을 때, 떼었을 때 1. mouseover, mouseout $('.menu_ul_li') .mouseover(function() { $('.menu_sub_div').show(); $('.menu_wrap').css({'height':'130px'}); }) .mouseout(function() { $('.menu_sub_div').hide(); $('.menu_wrap').css({'height':'50px'}); }); 2. hover, (unhover) $('.menu_wrap' ).hover( function(){ $('.menu_sub_div').show(); $('.menu_wrap').animate({'height':'130px'},{queue:false,duration:300}); }, function(){..
210113 완전 심플 슬라이더2(자동으로 넘어가는 이미지 슬라이더) 구글에 carousel slider plugin 등등 조합해서 검색하면 굳이 안 만들어도 사용이 쉽고 간편하고 예쁜 슬라이더 많다. 그럼에도 굳이 만들어 쓰는건 아주 간단한 코드로 내가 나중에 다시 봐도 헷갈리지 않고 필요한 거 수정 변경해서 쓰고 싶기 때문이다. 이 슬라이더는 좌, 우 버튼 없이 설정한 시간에 맞춰 자동으로 다음 이미지로 넘어간다. HTML CSS #wrapper { width:100%; text-align:center; height:600px; } .slider_ul { display:inline-block; vertical-align:top; } .slider_li { display:none; } javascript : 아래 코드 중 i 부분에 이미지 슬라이더가 있는 ul의 아이디를..