본문 바로가기
반응형

jquery44

jQuery로 iframe에서 부모 창 함수 호출 jQuery로 iframe에서 부모 창의 함수를 호출하려면, JavaScript의 window.parent 객체를 사용할 수 있습니다. window.parent는 iframe의 부모 창을 참조하기 때문에 이를 통해 부모 창의 함수를 호출할 수 있습니다.예를 들어, 부모 창에 parentFunction이라는 함수가 있다고 가정하면, iframe 내부에서 이 함수를 호출하는 코드는 다음과 같습니다.   부모 창 코드 (parent.html) 부모 창     iframe 코드 (iframe.html) Iframe 부모 함수 호출   설명window.parent를 사용하여 부모 창에 접근합니다.parentFunction()은 부모 창에 정의된 함수이며, iframe에서 이를 호출하려면 w.. 2024. 9. 28.
jQuery를 사용하여 몇 번째 요소인지 알아내기 jQuery를 사용하여 몇 번째 요소인지 알아내기  jQuery를 사용하여 특정 클래스 이름을 가진 요소 중에서 몇 번째 요소인지 알아내려면, index() 메서드를 사용할 수 있습니다. 아래는 그 방법을 설명한 예제입니다.첫 번째 요소두 번째 요소세 번째 요소네 번째 요소  다음과 같은 jQuery 코드를 사용할 수 있습니다.$(document).ready(function(){ // 특정 요소를 선택 (예: 세 번째 요소) var specificElement = $('.my-class').eq(2); // 그 요소가 몇 번째인지 확인 var index = $('.my-class').index(specificElement); console.log("선택한 요소는 " + (ind.. 2024. 9. 10.
jQuery를 이용한 부모 창 특정 아이템 호출 jQuery를 이용한 부모 창 특정 아이템 호출  팝업 창에서 jQuery를 사용하여 부모 창의 특정 아이템(예: 특정 HTML 요소)을 호출하거나 조작하고 싶다면, window.opener 객체를 이용하여 부모 창의 DOM에 접근할 수 있습니다. 이를 통해 부모 창의 특정 아이템에 접근하고, 이를 조작할 수 있습니다.  예제 코드1. 부모 창 (parent.html)부모 창에서는 조작할 아이템(예: 특정 요소)을 정의합니다. 부모 창 이 텍스트가 팝업 창에서 변경될 것입니다. 팝업 창 열기   2. 팝업 창 (popup.html)팝업 창에서는 부모 창의 특정 아이템을 조작합니다. 팝업 창 팝업 창 닫기  설명window.opener: 팝업 창에서 부모 창을 참조합니다.wind.. 2024. 9. 8.
jQuery를 이용한 새창에서 부모창 함수 호출 jQuery를 이용한 새창에서 부모창 함수 호출  jQuery와 JavaScript를 사용하여 새 창(팝업 창)에서 부모 창의 함수를 호출하려면 window.opener 객체를 활용할 수 있습니다. 이 객체는 새 창이 부모 창을 참조할 수 있게 해주며, 이를 통해 부모 창에 정의된 함수를 호출할 수 있습니다.  예제 코드1. 부모 창 (parent.html)부모 창에서는 호출될 함수를 정의합니다. 부모 창 팝업 창 열기  2. 팝업 창 (popup.html)팝업 창에서는 부모 창의 함수를 호출합니다. 팝업 창 팝업 창 닫기 설명window.opener: 팝업 창을 열어준 부모 창을 참조합니다.window.opener.parentFunction('Hello from the popup!.. 2024. 9. 6.
jQuery를 이용한 브라우저 종료 이벤트 jQuery를 이용한 브라우저 종료 이벤트   jQuery를 사용하여 브라우저 종료 이벤트를 처리하고자 할 때, 사실 직접적으로 브라우저 종료를 감지할 수 있는 방법은 없습니다. 하지만 window.onbeforeunload 이벤트를 사용하여 사용자가 페이지를 떠나거나 브라우저를 닫기 전에 실행할 코드를 지정할 수 있습니다. onbeforeunload 이벤트 사용onbeforeunload 이벤트는 사용자가 페이지를 떠날 때 발생합니다. 페이지를 새로고침하거나 다른 페이지로 이동하거나, 브라우저를 닫으려고 할 때 이 이벤트가 발생합니다. $(window).on('beforeunload', function(event) { // 이 함수 안에서 수행할 작업을 여기에 추가합니다. // 예: 데이터를 .. 2024. 9. 4.
jQuery 새 창에서 부모 창 새로 고침 팝업 창에서 부모 창 새로고침   jQuery를 사용하여 새 창(팝업 창)에서 부모 창을 새로고침하는 방법은 다음과 같습니다. 이 방법은 팝업 창이 부모 창과 동일한 도메인에서 열려 있을 때 작동합니다. 팝업 창에서 부모 창을 새로고침하려면 window.opener 객체를 사용할 수 있습니다. // 부모 창을 새로고침하는 코드if (window.opener && !window.opener.closed) { window.opener.location.reload(); // 부모 창 새로고침 window.close(); // 팝업 창 닫기 (선택 사항)}  설명window.opener: 팝업 창을 열어준 부모 창을 가리킵니다. 팝업 창에서 부모 창에 접근할 때 사용됩니다.window.opener.. 2024. 9. 2.
심플한 애니메이션 탭(Tab bar animation) 결과 이미지  HTML먼저 HTML 구조를 작성합니다: Tab 1 Tab 2 Tab 3 Tab 4 Content 1 Content 2 Content 3 Content 4   CSS탭과 애니메이션 효과를 위한 CSS를 작성합니다:/* styles.css */body { font-family: Arial, sans-serif;}.tab-container { position: relative; display: flex; justify-content: space-around; margin-bottom: 20px; border-bottom: 2px solid #ddd;}.. 2024. 8. 6.
심플한 웹사이트 세로 메뉴 만들기(소스 포함) 샘플이미지    HTML Home Services + Web Development SEO Marketing About Contact    CSS (styles.css)body { font-family: Arial, sans-serif;}nav { width: 200px;}.vertical-menu { list-style-type: none; p.. 2024. 8. 6.
심플한 웹사이트 가로 메뉴 만들기(소스 포함) 샘플이미지  #html Home Services Web Development SEO Marketing About Contact   #css(styles.css)body { font-family: Arial, sans-serif;}nav { background-color: #333; overflow: hidden;}.menu { list-style.. 2024. 8. 6.
Toast Notification on Page Load Using JQuery #html / css / js #Author : Osaro Ochuko Adade #Toast Notification on Page Load Using JQuery #Notification / 알림 https://codepen.io/osaroadade/pen/oNXeNYE Toast Notification on Page Load Using JQuery Bootstrap toast notification with slide in animation using jquery.... codepen.io 2024. 2. 22.
Simple jQuery Toast Notifications (Growl) #html / css(scss) / js #Author : Kieran Boyle #Simple jQuery Toast Notifications (Growl) #Notification / 알림 https://codepen.io/kieran/pen/ajLvjm Simple jQuery Toast Notifications (Growl) ... codepen.io 2024. 2. 22.
Jquery Notification #html / css / js #Author : jhonsore #Jquery Notification #Notification / 알림 https://codepen.io/jhonsore/pen/mVNmKd Jquery Notification ... codepen.io 2024. 2. 22.