http://test.thedirectwedding.com/
반응형 홈페이지 PC버전중 메뉴부분 작업중에 문제가 생겨 여쭤봅니다 ㅠ
크롬이나 파이어폭스에선 문제가 없었는데 익스플로러에서만 상단메뉴중 가장 마지막 버튼을 누르니 체크가 계속안되네요 ㅠ
스크롤링 과정중에 상단에 닿는부분은 a태그를 이용해서 해당 a태그가 제일 위에 닿을때 메뉴에 선택효과가 나오도록
지정을 했는데 유독 마지막 버튼이 익스플로러에서만 클릭시엔 제대로 체크가 되지 않습니다 ㅠ
스크롤 내릴땐 체크가 잘먹는데 메뉴버튼 클릭시에만 문제가 생기네요.. ㅠ_ㅠ)
퍼블리싱 고수님분들의 답변을 기다립니다. 도와주세욧 ;ㅠ;)!!
답변 2개 / 댓글 3개
채택된 답변
+20 포인트
2016-09-22 (목) 23:26:59
$("#tab0"+i).offset().top
->
Math.floor( $("#tab0"+i).offset().top );
답변에 대한 댓글 1개
2016-09-22 (목) 22:32:26
해당 url 의 웹페이지를 확인해 본 결과
높이 좌표값에 의해 setClass(i) 함수가 적용되는 부분을 조금 수정해야 하는데,
메뉴의 갯수가 7개로 고정되는 것이라면 우선 수동으로 아래와 같이 수정해보세요.
Copy
//아래 for 문에 내용 추가for (var i = 1 ; i <= $(".top_menu").find("a").length ; i++){ var scr_top = $("#tab0"+i).offset().top if (d_stop >= scr_top ) { setClass(i); } //아래부분 추가함 else if(d_stop > 4200) { setClass(7); }}마지막 메뉴 fnMove('7')의 높이 좌표값이 대략 4308 정도 나오네요.
그래서 else if(d_stop > 4200) 이런식으로 추가한 겁니다.
만약에 "웨딩홀 리스트" 위 부분의 내용이 많아지면 7번째 메뉴의 높이 좌표값도 바뀌기 때문에 이때에는 수동으로 4200 보다 큰 수로 변경해야 합니다.
이것을 자동으로 하고 싶다면
마지막 scr_top 의 값을 변수(last_scr_top)로 지정하고 d_stop 와 last_scr_top를 비교하는 방식(d_stop > last_scr_top)으로 처리하면 될 것같습니다.
답변에 대한 댓글 2개
2016-09-23 (금) 04:13:34
제가 제시해 드린 방법보다는 "슈와이"님이 제시한 내용으로 소스를 수정하세요.
마지막 메뉴의 좌표값이 소수점 아래까지 잡히는 것이 문제였나 봅니다.
그냥
var scr_top = $("#tab0"+i).offset().top <-- 이부분을
var scr_top = Math.floor( $("#tab0"+i).offset().top ); <-- 이렇게 고치기만 하면 됩니다.
마지막 메뉴의 좌표값이 소수점 아래까지 잡히는 것이 문제였나 봅니다.
그냥
var scr_top = $("#tab0"+i).offset().top <-- 이부분을
var scr_top = Math.floor( $("#tab0"+i).offset().top ); <-- 이렇게 고치기만 하면 됩니다.
2016-09-23 (금) 10:29:42
넵 ^^; 슈와이님이 알려주신방법으로 처리했더니 바로 잘되네요.
선우님도 정말 감사합니다 ㅠ_ㅠ)!!
선우님도 정말 감사합니다 ㅠ_ㅠ)!!
답변을 작성하려면 로그인이 필요합니다.