jQuery Flip! div 내에서 이벤트를 클릭하십시오

학교 프로젝트 용 웹 앱을 공부하는 플래시 카드를 만들려고하고 있습니다. Flip! div에있는 flip 함수에 바인딩 된 클릭 이벤트로 앵커를 놓았을 때 문제가 있습니다. 뒤집기. jQuery를 처음 사용합니다. 어떤 도움을 주시면 감사하겠습니다. 플립 포럼이 있습니까? 내 코드는 아래와 같습니다.jQuery Flip! div 내에서 이벤트를 클릭하십시오

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Flippant</title> 
    <script src="http://www.google.com/jsapi" type="text/javascript"></script> 
    <script type="text/javascript"> 
    //<![CDATA[  
    google.load("jquery", "1.3.2"); 
    google.load("jqueryui", "1.7.2"); 
    //]]> 
    </script> 
    <script type="text/javascript" src="jquery.flip.js"></script> 
    <script type="text/javascript"> 
    var f2b = function(){ 
    $("#card").flip({ 
     direction: 'tb', 
     color: '#B34212', 
     content: $('#back') 
    }); 
    } 

    var b2f = function(){ 
    $("#card").flip({ 
     direction: 'tb', 
     color: '#B34212', 
     content: $('#front') 
    }); 
    } 
    $(document).ready(function(){ 
    $("#flip1").click(f2b); 
    $("#flip2").click(b2f); 
    $("#flip2").click(); 
    }); 
    </script> 
    <style type="text/css"> 
    .back { display: none; } 
    .front { display: none; } 
    </style> 
</head> 
<body> 
    <div class="card" id="card"></div> 
    <div class="front" id="front"> 
    This is <br /> 
    the front <br /> 
    of the card. <br /> 
    <a href="#" id="flip1" title="flip to back">Flip1</a> 
    </div> 
    <div class="back" id="back"> 
    This is<br /> 
    the back<br /> 
    of the card.<br /> 
    <a href="#" id="flip2" title="flip to front">Flip2</a> 
    </div> 
</body> 
</html>

출처

2009-09-26 kzh

# flip2에 할당 된 두 개의 클릭 기능이있는 이유는 무엇입니까? – yoda

두 번째 버튼은 첫 번째 버튼에 의해 설정된 클릭 기능을 호출합니다. 두 번째 것은 아무 것도 지정하지 않습니다. – kzh

죄송합니다. 귀하의 질문에 이해가되지 않습니다. 지금은 무엇을하고 있으며 무엇을해야합니까? 당신은 방금 "나는 문제가있다"고 말했다. –

플립 플러그인은 준비된 문서에서 설정 한 이벤트 처리기를 파괴합니다. 그 주위에있는 방법은 live event binding입니다. 여기에 문서 준비 기능을 변경합니다

$("#flip1").live('click', f2b); 
$("#flip2").live('click', b2f); 
$("#flip2").trigger('click');

편집 :

.card { height: 200px; width:200px; }
: 나는 또한이 같은, 당신의 CSS에 폭을 지정하지 않는 한 최초의 애니메이션이 발생하지 않는 것 언급해야

출처

2009-09-27 03:06:05

jQuery Flip! div 내에서 이벤트를 클릭하십시오

답변

관련 문제