쿠키 값을 가져온 후 jquery hover가 작동하지 않습니다.

Question

목록보기, 갤러리 및 그리드 용보기 전환기가있는 항목 목록이 있습니다. 쿠키로보기를 변경할 때

<div class="theView"> 
    <div class="galS active" id="gal"><span><img src="layout/cyt/img/blank.gif"></span>Galerie</div> 
    <div class="mosS" id="mos"><span><img src="layout/cyt/img/blank.gif"></span>Mosaik</div> 
    <div class="listS" id="list"><span><img src="layout/cyt/img/blank.gif"></span>Liste</div> 
</div> 


    <div id="itemcontainer"> 
     <div class="con"> 
     <div class="item_page_item list"> //list,mos,gal 
      <div class="item sale"><span class="number">1</span> 
       <div class="pos"> 
        <div class="inner"> 
        <div class="itemImg Img123"></div> 
        ... 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 

나는 그들 각각에 대해, 값을 저장합니다

$("#gal").click(function() { 
    $("#gal").addClass("active"); 
    $("#list").removeClass("active"); 
    $("#mos").removeClass("active"); 
    $(".item_page_item").fadeOut(200, function() { 
     $.cookie("theView", "g", { expires: 7, path: "/" }); 
     $(this).removeClass("list"); 
    $(this).removeClass("mos"); 
    $(this).addClass("gal").fadeIn(200); 
    }); 
    return false; 
}); 

목록보기는 처음 열 가진 그리드 또는 갤러리, 통합과 호버 창으로 변경 회전 목마가 열리지 않습니다. 다른 모든 경우에는 모든 것이 깨지기 쉽습니다.

$(".item_page_item.mos").hover(function(){ 
      $(this).find(".pane").stop(true, true).fadeIn(); 
      $("#paneImg",this).carouFredSel({ 
       responsive: true, 
       circular: false, 
       auto: false, 
       items: { 
        visible: 1, 
        width: 299, 
        height: 241 
       }, 
       scroll: { 
        fx: 'directscroll' 
       } 
      }); 

      $("#paneThumb",this).carouFredSel({ 
       responsive: true, 
       circular: false, 
       infinite: false, 
       auto: false, 
       prev: '#prev', 
       next: '#next', 
       items: { 
        visible: { 
         min: 2, 
         max: 5 
        }, 
        width: 51, 
        height: 42 
       } 
      }); 
      $('#paneThumb a',this).click(function() { 
       $('#paneImg').trigger('slideTo', '#' + this.href.split('#').pop()); 
       $('#paneThumb a').removeClass('selected'); 
       $(this).addClass('selected'); 
       return false; 
      }); 
     },function(){ 
      $(this).find(".pane").stop(true, true).fadeOut(200, function() { 
      $("#paneImg",this).trigger("destroy", true); 
      }); 
     }); 

가면, 오버레이는 캐 러셀 (caroFredsel)와 아이템 위에 페이드 : 여기

는 호버 함수의 코드이다.

유일한 문제는 목록보기를 쿠키에 저장하고이보기로 페이지를 열고 다른보기로 변경할 때 문제가 있다는 것입니다.

당신이 나를 도울 수 있기를 바랍니다, 나는 미쳐 가고 있습니다.

쿠키 값 읽어들이는 기능

: 당신은 위임을 사용이 코드를 테스트 할 수

$(function() { 
     var cc = $.cookie("theView"); 
     if (cc == "g") { 
      $(".item_page_item").removeClass("list"); 
      $(".item_page_item").removeClass("mos"); 
      $(".item_page_item").addClass("gal"); 
      $("#gal").addClass("active"); 
      $("#list").removeClass("active"); 
      $("#mos").removeClass("active"); 

     } else if (cc == "m") { 
      $(".item_page_item").removeClass("gal"); 
      $(".item_page_item").removeClass("list"); 
      $(".item_page_item").addClass("mos"); 
      $("#mos").addClass("active"); 
      $("#gal").removeClass("active"); 
      $("#list").removeClass("active"); 
     } else if (cc == "l") { 
      $(".item_page_item").removeClass("gal"); 
      $(".item_page_item").removeClass("mos"); 
      $(".item_page_item").addClass("list"); 
      $("#list").addClass("active"); 
      $("#gal").removeClass("active"); 
      $("#mos").removeClass("active"); 
     }  
    }); 

Answer 1

는, 어쩌면 문제는 여기에서 오는 : {대체 당신의 호버 핸들러}

$(document).on('mouseenter mouseout', '.item_page_item.mos', function (e) { 
    if (e.type === 'mouseenter') { 
     $(this).find(".pane").stop(true, true).fadeIn(); 
     $("#paneImg", this).carouFredSel({ 
      responsive: true, 
      circular: false, 
      auto: false, 
      items: { 
       visible: 1, 
       width: 299, 
       height: 241 
      }, 
      scroll: { 
       fx: 'directscroll' 
      } 
     }); 

     $("#paneThumb", this).carouFredSel({ 
      responsive: true, 
      circular: false, 
      infinite: false, 
      auto: false, 
      prev: '#prev', 
      next: '#next', 
      items: { 
       visible: { 
        min: 2, 
        max: 5 
       }, 
       width: 51, 
       height: 42 
      } 
     }); 
     $('#paneThumb a', this).click(function() { 
      $('#paneImg').trigger('slideTo', '#' + this.href.split('#').pop()); 
      $('#paneThumb a').removeClass('selected'); 
      $(this).addClass('selected'); 
      return false; 
     }); 
    } else { 
     $(this).find(".pane").stop(true, true).fadeOut(200, function() { 
      $("#paneImg", this).trigger("destroy", true); 
     }); 
    } 
});