jquery 검색 결과

해당 글 11건

[jQuery]마우스 반응하는 3D팝업 및 click toggle 이벤트

팝업 관련해서 코드를 찾다가 재미있는 3D 팝업을 발견해서 'ㅡ' 소개를 해볼까하네요. 마우스에 반응하는 3D팝업이며, 추가로 버튼을 클릭하면 팝업이 사라지고 나타나게 jQuery의 click 이벤트 toggle를 적용 해놓았습니다. ↓↓↓↓↓↓ I'm a new kind of popup. Move your mouse around ! POPUP Show/Hide I'm a new kind of popup. Move your mouse around ! POPUP Show/Hide var moveForce = 30; // max popup movement in pixels var rotateForce = 20; // max popup rotation in deg $(document).mousemove(fun..

Tistory Blog/Html,Css 편집 2016. 6. 23. 00:03

[jQuery]티스토리 댓글 중복 입력 방지하는 방법(버튼 disabled)

[jQuery]티스토리 댓글 중복 입력 방지하는 방법(버튼 disabled) 티스토리 댓글은 가끔 폼은 입력 버튼을 누른 다음 몇 초의 딜레이가 발생합니다.그래서 댓글이 정상적으로 입력중이라는 표시가 없기 때문에 방문객들이 댓글 입력 버튼이 제대로 되었는지 판단하기 어렵기 때문에여러번 댓글입력버튼을 클릭 하게 됩니다. 그럼.. 댓글이 중복으로 생겨버리죠;;스팸처럼.. 일일히 지울기도 귀찮고.. 사실 기존에는 http://zzznara2.tistory.com/625 by 꿈꾸는 우림님께서제작 해주신 스크립트를 사용 하고 있었습니다.중복 체크를 막는 기능을 문의 드렸는데 버튼을 disabled 하는 방식으로 좋은 아이디어를 내시고스크립트를 만들어 주셨습니다. Primary button 비활성 Primary ..

Tistory Blog/Html,Css 편집 2016. 4. 6. 14:50

[jQuery] 애드센스 광고차단(Adblock)시 알림창 만들기(특정 클래스 제외시)

안녕하세요. 특정 클래스 제외 하는 방법을 찾다가 재밌는 코드를 발견해서 소개를 해드릴가 합니다. 아마 애드센스 광고를 설치하는 분들에게는 도움이 될 것 같네요.(ㅠ_ㅠ 임시저장이 날라가버려서 다시 작성하는 글이네요.. 아오 ㅠ_ㅠ) 바로!! 애드센스 광고 차단시 알림창 만들기 적용 방법은 간단합니다.우선 본인의 광고 코드를 .adsense-area 클래스명의 div 태그로 감싸줍니다. 클래스명은 본인이 수정해도 상관없습니다. 본인의 애드센스 광고 code 광고를 본문 상단, 본문 하단, 사이드바 총 3개를 설치 했다면전부 다 할 필요는 없고 본문 상단 광고에만 작업을 해주는 것이 가장 좋습니다.접속하자 마자 바로 보이니까요 위 작업이 끝났다면 위에 스크립트를 추가 해줍니다. 끝입니다 쉽죠? checkA..

Tistory Blog/Html,Css 편집 2016. 3. 30. 17:15

[jQuery] 블로그 배경화면 랜덤으로 뜨게 하기(background-image random)

안녕하세요. 블로그 꾸미기 포스팅은 오랜만에 하는 것 같네요 ㅠ_ㅠ 제 블로그의 꾸미기가 거의 다 끝나버려서.. ㅠ 소재고갈..혹시나!! 홈페이지나 블로그 꾸미기 궁금한 점이 있으면!! 언제든지!! 방명록 문의하기를 해주시면저도 열심히 방법을 찾아보도록 할게요. (面ㅅ面) 오늘은 저번에 일정 시간마다 자동으로 페이드인 페이드아웃으로 교체되는 배경화면http://cocosoft.kr/389 - 배경화면 여러개 바꾸기에 이어서 배경화면 시리즈 2편!! 랜덤 배경화면 입니다!! 오늘 만들 것은? 랜덤 배경화면!! 시작해보자 오늘 알아볼 것은 블로그의 배경화면을 랜덤으로 바꿔주는 jQuery 코드입니다. 완성된 예제 -새로고침 누를때마다 랜덤으로 배경화면이 바뀜- iframe을 지원하지 않는 브라우저를 사용하고..

Tistory Blog/Html,Css 편집 2016. 3. 27. 05:13

[jQuery]html 체크박스 체크시 이벤트 동작 발생

예전에도 input type="checkbox" 의 이벤트 실행해 대해서 포스팅 한 적 있습니다. 개인적으로 체크박스로 만들어 진 것은 제어하기가 편해서 많이 사용 하는 것 같네요. 오늘은 간단하게 체크박스 클릭시 해당 라벨 등에 이벤트를 주는 방식을 알아보겠습니다. 오늘 만들 예시입니다. 체크박스를 체크 또는 라벨(이 문구)을 클릭시 글자가 변합니다. 체크박스를 체크 또는 라벨(이 문구)을 클릭시 글자가 변합니다. 시작 체크박스 설치 우선 간단하게 체크박스를 설치해야겠죠? html영역에 간단하게 삽입을 해줍니다.(jQuery는 2.1.3 버전을 사용 했습니다.) 체크박스를 체크 또는 라벨(이 문구)을 클릭시 글자가 변합니다. 간단하게 체크박스가 설정 되었습니다.이벤트를 실행시키는 방식은 비슷합니다. 다..

Tistory Blog/Html,Css 편집 2016. 3. 23. 01:05

[SVG]글씨 써지는 효과 코드로 만들기 (jQuery DrawSvg || pure CSS)

안녕하세요. 오늘은 움직이는 로고만들기에 대해서 알아보겠습니다.기존에 로고에 관련해서는 여러개의 포스팅을 진행 한적이 있습니다. ※ 이 것을 먼저 보고 오시면 도움이 이글을 이해하는데 도움이 됩니다. http://cocosoft.kr/386 - 블로그 로고 벡터이미지 svg파일로 만들기 및 사용법일러스트로 벡터 이미지 path 선따는 법을 알고 오시면 정말 재밌습니다. 인트로 우선 저는 웹언어 웹코딩 웹디자인 전문ㅠ 전공자도 아니고 아예 문외한 비전공자입니다.그래서 지식의 깊이가 얇으며, 부족한 점도 많지만.. 잘못 설명하는 점도 있을 수있지만 ㅠ_ㅠ 양해를 해주시고봐주시면 좋을 것 같네요. 사실 지금 글을 적으면서도 이러한 방법으로 하는게 맞는 것인지는 모르겠지만최대한 아는 방법을 설명하겠습니다!! 암..

Tistory Blog/Html,Css 편집 2016. 3. 15. 01:08

[jQuery]티스토리 배경화면 여러개 바꾸기 페이드효과 (background change fade)

오늘도 갑자기 쓸데없는게 생각나서.. 우연히 배경을 검색하다가 우주배경 예쁜게 너무많아서 ㅠ_ㅠ 동시에 여러개의 배경을 사용하고 싶어서 포스팅 작성을 시작하게 되었습니다.... 오늘의 목표 여러개의 배경화면은 자동으로 페이드인 페이드아웃 효과를 주면서 교체하는 방법을 알아보겠습니다. 예쁘쥬?? 사실 요즘 애플스타일 같은 페이지가 많이 나타나면서.. 쭉스크롤을 내리면 배경이 바뀌는 스크립트는 많은데 의외로 페이드인 페이드아웃으로 배경이 계속 바뀌는 것은 잘 없더라구요. 우선 PURE CSS!! 아이러브 퓨어시에스에스!!!♡ 로 하는 방법도 있긴합니다. @keyframes background-changer { 0%, 100% { background-image: url(./images/배경1.jpg); } 5..

Tistory Blog/Html,Css 편집 2016. 3. 14. 02:32

[jQuery] input checkbox 이벤트 실행

오늘은 거의 역대급.. 뻘짓..작업(?) 시간 낭비.. 지금 이글을 적으면서도 왜했지? 라는 생각이 드는 ㅠ_ㅠ input type="checkbox" 의 이벤트 실행하는 함수입니다. 라이브리 댓글 토글 버튼 디자인 구경하다가 완전 깜찍한 토글 버튼을 발견해서저녁 내내 ㅠ_ㅠ 갖다 붙여넣기 했는데뭔가 괜히 찝찝한 느낌입니다... 며칠 이내로 때버릴 것 같네요. 그래도 언젠가는 쓸일이 있겠지.. 특징이라면 .attr() 안돼서 .prop() 요걸로 했다는... 차이점은... 구글 ㄱㄱ!! See the Pen input checkbox 이벤트 by JCM (@cocosoft) on CodePen. //토글키 $('#toggle--daynight').on('click', function() { if ( $(..

Tistory Blog/Html,Css 편집 2016. 3. 8. 23:02

[jQuery]블로그 따라다니는 사이드바 만들기(배너 메뉴 포함)

안녕하세요. 오늘은 jQuery 스크립트를 사용해서 따라다니는 사이드바를 만들어 보겠습니다. 예전에 화면에 아예 고정되고 따라다니는 플로팅 메뉴를 만든적이 있긴한데http://cocosoft.kr/149 - 플로팅메뉴(추천위젯,광고)오늘은 사이드바의 메뉴 하나 또는 몇개만! 움직이는 따라다니면서 움직이는 형태를 알려드리겠습니다. 당연히 사용 전제 조건으로 jQuery 사용해야겠죠?요즘 웬만한 스킨이나 티스토리 공식 반응형 웹 스킨등에서도 jQuery를 사용하고 있긴합니다. 완성된 예제 입니다. 스킨의 상관없이 기존 사이드바 div 태그에 값만 설정 추가 해주면어느 사이드바에서도 사용이 가능합니다. intro - 사이드바에 대한 고찰 요즘 티스토리에서도 반응형 웹스킨을 공식적으로 지원하고 있고 해외 포럼이..

Tistory Blog/Html,Css 편집 2016. 2. 22. 00:00

[jQuery]티스토리 맨위로 버튼(스르륵 부드러운 스크롤 이동 만들기)

오늘은 일정 위치 까지 스크롤이 내려가면 스스륵 생기고부드럽게 스크롤 이동 되어 올라가는 맨위로 가기 버튼을 만들어 보겠습니다. jQuery를 사용해서 만들텐데요.jQuery는 다양하고 유용한 자바스크립들의 라이브러리라고 보시면 됩니다. 우선 jquery를 사용하기 위해서 실행(?) 선언(?)을 해줍니다.다양하게 소스를 추가 하는 방식이 있는데간편하게 외부서버 CDN을 이용해서 추가를 할 것입니다. 티스토리 블로그 대부분의 반응형 스킨을 사용하면 설정이 되어 있을 거에요.※혹시나 본인의 티스토리 블로그 스킨 HTML편집에서 jQuery가 추가 되어 있다면이작업은 건너 뛰어도 좋습니다. 만약 없다면 소스를 추가 해줘야 합니다. jQuery 소스 - [HTML]에 추가 스크립트 파일은 또는 부분에 붙혀 넣기..

Tistory Blog/Html,Css 편집 2016. 2. 10. 02:35