FancyBox和自定義工具提示在一起不會工作

我使用FancyBox和一個非常簡單的jQuery工具提示在一起，如果沒有點擊圖像，工具提示是用於顯示頁面上的「標題」。如果點擊圖像，fancybox將接管標題以在「內部」顯示標題標籤。標題一旦點擊圖像就不會顯示，但工具提示即可。是否有可能讓他們一起工作？FancyBox和自定義工具提示在一起不會工作

這裏是jQuery的工具提示：

$(document).ready(function(){ 
    tooltip(); 
}); 

this.tooltip = function(){ 
    $("a.tooltip").hover(function(e){            
     this.t = this.title; 
     this.title = "";          
     $("body").append("<p id='tooltip'>"+ this.t +"</p>"); 
     $("#tooltip").fadeIn("fast");  
    }, 
    function(){ 
     this.title = this.t;   
     $("#tooltip").remove(); 
    }); 
    $("a.tooltip").mousemove(function(e){ 
     $("#tooltip") 

    });   
};

這裏是我的fancybox代碼：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("a#example8").fancybox({ 
      'titlePosition': 'over' 
     }); 
    }); 
</script>

這是HTML代碼：

<a id="example8" class="tooltip" href="./example/8_b.jpg" title="Sed vel sapien vel sem tempus placerat eu ut tortor. Nulla facilisi. Sed adipiscing, turpis ut cursus molestie, sem eros viverra mauris, quis sollicitudin sapien enim nec est. ras pulvinar placerat diam eu consectetur."> 
    <img class="last" alt="example7" src="./example/8_s.jpg" /> 
</a>

來源

2012-07-26 olo

您似乎有一個額外的}）; tooltip（）後; 如果您能就此問題製作一個www.jsfiddle.com，那麼最好的做法是讓我們可以更輕鬆地進行工作。 – jholloman 2012-07-26 03:37:34

http://jsfiddle.net/ynXvx/7/ Tooltip在jsfiddle上不起作用 – olo 2012-07-26 03:49:48

fancybox的導入功能對我不起作用，所以我重新編寫了這些代碼並重新編寫了代碼：http://jsfiddle.net/ynXvx/ 8 /不知道工具提示應該做什麼，你有鏈接的JS文件？ – jholloman 2012-07-26 04:03:10

聲明之上的全局變量你的JavaScript，例如

var thisTitle;

然後使用該變量克隆title您提示腳本（而不是this.t）內的類似

this.tooltip = function(){ 
    $("a.tooltip").hover(function(e){            
     thisTitle = this.title; 
     this.title = "";          
     $("body").append("<p id='tooltip'>"+ thisTitle +"</p>"); 
     $("#tooltip").fadeIn("fast");  
    }, 
    function(){ 
     this.title = thisTitle;   
     $("#tooltip").remove(); 
    }); 
    $("a.tooltip").mousemove(function(e){ 
     $("#tooltip") 

    });   
}

在你的fancybox自定義腳本，使用titleFormat API選項從thisTitle拉title像

$("a#example8").fancybox({ 
    "titlePosition": 'over', 
    "titleFormat" : function(){ 
     return '<span id="fancybox-title-over">'+thisTitle+'</span>' 
    } 
});

全部在一起嗎？

<script type="text/javascript"> 
var thisTitle; 
$(document).ready(function(){ 
tooltip(); 
$("a#example8").fancybox({ 
    "titlePosition": "over", 
    "titleFormat": function(){ 
     return '<span id="fancybox-title-over">'+thisTitle+'</span>' 
    } 
}); // fancybox 
}); // ready 

this.tooltip = function(){ 
    $("a.tooltip").hover(function(e){            
     thisTitle = this.title; 
     this.title = "";          
     $("body").append("<p id='tooltip'>"+ thisTitle +"</p>"); 
     $("#tooltip").fadeIn("fast");  
    }, 
    function(){ 
     this.title = thisTitle;   
     $("#tooltip").remove(); 
    }); 
    $("a.tooltip").mousemove(function(e){ 
     $("#tooltip") 
    });   
} 
</script>

來源

2012-07-27 01:20:38 JFK

非常感謝JFK！有用：-） – olo 2012-07-27 03:21:59

FancyBox和自定義工具提示在一起不會工作

回答

相關問題