반응형 프로그램524 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. Timeline html, css, jsTimelineAuthor : haraldev01타임라인 / Timeline https://codepen.io/haraldev01/pen/NWVvNqy TimelineTimeline element inspired by Ibelick: https://www.ibelick.com/lab/timeline I expanded on the design, as it now correctly shows the selected year, high...codepen.io 2024. 8. 8. Horizontal Timeline of Web Development html, css, jsHorizontal Timeline of Web DevelopmentAuthor : Jerome Rass타임라인 / Timeline https://codepen.io/jerora98/pen/yLWzYGO Horizontal Timeline of Web DevelopmentExplore the evolution of web development through this interactive horizontal timeline. Scroll horizontally to navigate through the major milestones in ...codepen.io 2024. 8. 8. Basic Timeline html, css, jsBasic TimelineAuthor : J타임라인 / Timeline https://codepen.io/jaingam/pen/RwmjarP Basic TimelineBasic timeline component with dark mode compatibility. Using tailwindcss....codepen.io 2024. 8. 8. Timeline in Dark Theme html, cssTimeline in Dark ThemeAuthor : Muzammal Ahmed타임라인, Timeline https://codepen.io/MuzammalAhmed/pen/MWdVwVo Timeline in Dark ThemeIDK what to say but follow me for more awesome content...codepen.io 2024. 8. 8. Scrolling timeline clickable years html, css, jsScrolling timeline clickable yearsAuthor : buildplan타임라인 / Timeline https://codepen.io/buildplan/pen/pomLawb Scrolling timeline clickable yearsScrolling timeline clickable years with jquery...codepen.io 2024. 8. 8. Vertical Timeline With Icons #html / css#Vertical Timeline With Icons#Author : Riley Egge#타임라인/ Vertical Timeline https://codepen.io/eggeriley/pen/QWReeXO Vertical Timeline With IconsA vertical timeline widget using Font Awesome and pure css. ...codepen.io 2024. 8. 8. 이전 1 2 3 4 ··· 44 다음
