JS (4) 썸네일형 리스트형 [Web] 새로고침하면 초기화면으로? window.history.replaceState가 원인이었다 브라우저 새로고침시 초기화면(list)로 돌아가버리는 문제, 한 줄 주석이 해결했다혹시 화면 작업하다가 뒤로가기는 잘 되는데 새로고침 누르니까갑자기 list 화면으로 튕겨버린 경험 있으신가요?저도 최근에 겪었던 문제인데, 원인은 의외로 간단했습니다. 문제 발견: replaceState가 파라미터를 삭제해결 과정: 코드 한 줄의 차이pushState vs replaceState 차이점SPA 히스토리 관리 팁 작업환경 : 전자정부프레임워크(스프링 프레임워크), JSP, JavaScript 문제 발생: 새로고침(F5) 시 초기페이지로 돌아감초기에 list 페이지에서 -> view 페이지로 이동, 이후 view에서 새로고침 -> 새로고침이 현재 view 페이지가 아닌 초기페이지인 list로 .. swiper js 자동플레이가 잘 안될때 swiper js 사용하여 슬라이드를 자동플레이 하는데 슬라이드가 끝까지 가고 나서 처음으로 되돌아 와야 하는데 안되고 멈춰있는 경우가 있다. 기본적으로 swiper 설정시 loop: true 로 세팅하면 레이어 끝까지 가면 자동으로 처음으로 가서 플레이돼야 하는데 안 되는 경우가 있다. 이런 경우 인덱스가 바뀌는 이벤트에서 슬라이드가 끝까지 왔는지 체크 후 끝이면? 초 후에 슬라이드를 0번으로 변경한다. swiper js 카테고리별로 보여주는 방법은 아래와 같습니다. swiper js 카테고리별로 보여주기 swiper js 를 사용해서 slide 화면을 보여주는 경우가 많은데 세부 카테고리 버튼을 두고서 클릭시 해당 카테고리 slide 내용만 보여주는 방법 참고 : https://codepen.io/l.. swiper js 카테고리별로 보여주기 swiper js 를 사용해서 slide 화면을 보여주는 경우가 많은데 세부 카테고리 버튼을 두고서 클릭시 해당 카테고리 slide 내용만 보여주는 방법 참고 : https://codepen.io/lpla/pen/QWQErNr 전체 음료 빵 과일 콜라 햄버거 우유 커피 샌드위치 케익 사과 바나나 .cate { margin: 30px 0 0 30px; } .cate h1 { cursor: pointer; margin: 0 0 10px; } .cate h1.active { color: #174ec9; } .swiper-container { margin: 50px auto; width: 1000px; } .swiper-slide { text-align: center; } .swiper-slide img { m.. 마우스로 드래그 앤 드롭 (Sort) 마우스로 정렬 (Sort) JS로 마우스를 이용해서 드래그 앤 드랍 하는 방법 과 정렬한 순서를 얻어서 백엔드로 넘기기 전까지 과정 입니다. 개인적인 참고용이라 두서가 없습니다. 혹시 본다면 참고만 하세요. 데모 : https://jsbin.com/yunakeg/edit?html,css,js,output JS Bin Sample of the bin: jsbin.com 소스 : http://sortablejs.github.io/Sortable/ 이전 1 다음
