2009-07-09 6 views
2

jQuery Fancybox pluginを使用して、コンテンツとしてhrefのリンクと、キャプションとしてtitleのモーダルウィンドウを作成しています。キャプションにクリック可能なリンクを設定して(この場合は地図を大きくする)、title属性に<a>タグを配置することはできません。このリンクをJavascript、jQuery、またはその他の方法で使用するにはどうすればよいですか?たぶんタイトル属性内にリンクを挿入できますか?

<a class='iframe' href='http://maps.google.com/maps?q=%235+Health+Department+Drive,+Troy,+MO+63379&amp;ll=38.979228,-90.97847&amp;z=13&amp;iwloc=near&amp;num=1&amp;output=embed' title='Google Map to Lincoln County Health Department'>Map to LCHD</a> 

What it looks like http://i31.tinypic.com/i6frq1.png

答えて

2

([]またはオペレータで)あなたのクリックイベントにリンクマップからの値を使用することができます。

アンカー内のコンテンツ要素を埋め込み、導入する要素を使用するようにプラグインを変更することができます。例:

<a class='iframe' 
    href='http://maps.google.com/blahlblahlbah' 
    title='Google Map to Lincoln County Health Department'>Map to LCHD 
    <span class="title-href" style="display: none">http://zebrakick.com</span> 
</a> 

0

ない最高の提案がありますが、多分これ

<a class='iframe' href='http://maps.google.com/maps?q=%235+Health+Department+Drive,+Troy,+MO+63379&amp;ll=38.979228,-90.97847&amp;z=13&amp;iwloc=near&amp;num=1&amp;output=embed' title='Google Map to Lincoln County Health Department' dest="/path/to/file.ext">Map to LCHD</a> 
0

のようなものがオブジェクトとしての要素=> destination_linkマップを保ち、そしてから値を取得し、独自のatributeを作ることができますそれはリダイレクトのためです。

var linkmap = { 
    lincoln: '/location/3/', 
    someplace: '/location/99' 
} 

は今、あなたは、私はこのプラグインに慣れていないんだけど、この方法が頭に浮かぶ

0

私は一緒に追加のデータを渡さ:

<a href="images/product.jpg" title="Product nummer 1" data-title-url="http://google.nl" rel="fancybox"> 

をしてタイトルを設定するためのカスタムコールバックを使用:

{ 
    //fancybox options array 
    titleFormat: function(title, currentArray, currentIndex, currentOpts){ 
     var currentElement = currentArray[currentIndex]; 

     var html = "<h1>" + title + "</h1>"; 
     var titleUrl = $(currentElement).data("title-url"); 
     if (titleUrl) { 
      var link = $("<a>", {href: titleUrl, text: titleUrl, target: "_blank"}); 
      html += " (" + link.prop("outerHTML") + ")"; 
     } 

     return html; 
    }, 
} 

http://fancybox.net/api

http://api.jquery.com/data/

関連する問題