jQuery 8 jQuery "$(window).scrollTop()", Javascript "window.scrollY" 비교 $(window).scrollTop() and window.scrollY are both used to determine the vertical scroll position of a web page. However, there are some differences between them. $(window).scrollTop() is a jQuery method that returns the current vertical position of the scroll bar for the first element in the set of matched elements or sets the vertical position of the scroll bar for every matched element. It is .. 2024. 1. 21. (function () {})(); (function () { /* ... */ })(); (function () { /* ... */ }()); (() => { /* ... */ })(); a regular function function () {} + function call (); IIFE - Immediately-Invoked Function Expression - It executes immediately after it’s created. It was popular in JavaScript as a method to support modular programming before the introduction of more standardized solutions such as CommonJS and ES modules. Imme.. 2022. 8. 29. jQuery fadeOut(), fadeIn() fadeOut() / fadeIn() .fadeOut( [ duration ], [ callback ] ) Returns: jQuery .fadeOut( [ duration ], [ easing ], [ complete ] ) $(selector).fadeOut( speed, easing, callback) The fadeOut() method Animates the opacity of the matched elements. Hides the matched elements by fading them to transparent. Hidden elements will not be displayed at all. 1. Once the opacity reaches 0, 100% 투명하게 되면, 2. the di.. 2021. 10. 9. Position Sticky를 구현하는 Fixed JS 코드 활용 1. 원글: Position Sticky를 구현하는 Fixed JS 코드 오류 수정 2. 수정: Position Sticky를 구현하는 Fixed JS 코드 2차 수정본 3. 수정: Position Sticky를 구현하는 Fixed JS 코드 3차 수정본 4. 수정: Position Sticky를 구현하는 Fixed JS 코드 4차 수정본 5. 활용: 본문 cloneNode()를 사용하여 DOM 객체의 복제본을 만들지 않고, siblings()를 사용하여 'position: fixed' 지정할 객체의 위 혹은 아래 객체(element)에 margin 속성을 부여하는 방법입니다. 1. 'position: fixed' 객체의 빠져나간 공간을 상위 sibling 객체에 marginBottom을 지정하여 메우는.. 2021. 10. 5. jQuery 메서드 비교 append, prepend append() Inserts the specified content, to the end of each element in the set of matched elements. Inserts the specified content as the last child of each element in the jQuery collection. Puts data inside an element at the last index 잘라서 붙여 넣기(이동) / 콘텐츠 끼워 넣기 syntax: .append( content [, content ] ) .append( function ) $gnb.find("li").each(function() { if ( $(this).find("a").prop("href") == wind.. 2021. 8. 22. jQuery 메서드 비교 hide, detach, empty, remove hide() Hides the matched elements. Sets the matched elements' CSS display property to none. detach() Removes the set of matched elements from the DOM. Removes all child elements with the selected elements. Keeps all data and event handlers of the removed elements. Preferred to remove elements but to keep copy of the removed elements for reuse at a later time. How to reinsert the detached element.. 2021. 8. 15. Position Sticky를 구현하는 Fixed JS 코드 2차 수정본 1. 원글: Position Sticky를 구현하는 Fixed JS 코드 오류 수정 2. 수정: 본문 3. 수정: Position Sticky를 구현하는 Fixed JS 코드 3차 수정 4. 수정: Position Sticky를 구현하는 Fixed JS 코드 4차 수정 5. 활용: Position Sticky를 구현하는 Fixed JS 코드 활용 윗글에 이어서 다시 수정한 부분을 반영하여 설명 진행합니다. 수정 내역 1. 블로그의 댓글 리스트에서 한 항목 링크를 누르면 페이지가 열리면서 하단 댓글 리스트로 이동합니다. 이때 "position: fixed"입니다. 페이지의 최상단으로 이동하면 "position: static"으로 변경되어야 하는 데, 오류 때문에 바뀌지 않습니다. 위치 코드를 출력하는 검사.. 2021. 6. 10. Position Sticky를 구현하는 Fixed JS 코드 오류 수정 1. 원글: 본문 2. 수정: Position Sticky를 구현하는 Fixed JS 코드 2차 수정 3. 수정: Position Sticky를 구현하는 Fixed JS 코드 3차 수정 4. 수정: Position Sticky를 구현하는 Fixed JS 코드 4차 수정 5. 활용: Position Sticky를 구현하는 Fixed JS 코드 활용 Position Sticky는 웹 페이지의 일부 Element가 사전 설정한 지점에서 움직임을 중지하고 고정되어 Position Fixed의 기능을 시작하는 매우 유용한 CSS 코드입니다. "Position Relative + Position Fixed"를 하나로 통합한 것이라고 말할 수 있습니다. 대형 포털과 블로그 등 여러 사이트의 페이지 상단에 배치된 내.. 2021. 4. 19.
