重複の可能性:
マップリンクを使用してfancyboxを開く方法
イメージマップからのリンクを使用して、Fancybox を使用して単一の画像を表示する方法を見つけました。サイトへの統合に成功しました。しかし、何をやってもギャラリーを表示することはできません。
以下のコードを使用して、ImageMap から単一の画像を表示しています。
<script type="text/javascript">
$(document).ready(function() {
/* Tek imaj */
$("a#fbox").fancybox({
'overlayShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'titlePosition' : 'inside'
});
});
</script>
<script type="text/javascript">
/* Image Map'den */
//<![CDATA[
$(window).load(function(){
$('map > area.fbox').click(function(e) {
e.preventDefault();
var url = $(this).attr('href');
var title = $(this).attr('title');
var type = $(this).attr('rel');
$.fancybox({
'title': title,
'titlePosition': 'inside',
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'href' : url,
'type' : type
});
});
});//]]>
</script>
これらがスクリプトで、これが HTML です。
<area shape="rect" coords="417,80,477,93" href="blabla.jpg" class="fbox" title="more blablabla" rel="image" />