5

ヘルプ！私はライターチームのウェブサイトに取り組んでいます。

彼らは、シャドーボックス効果を使用して、自分が取り組んだ特定の仕事 (ポートフォリオ) の例を示したいと考えています。

たとえば、実際には .doc のスクリーンショットである画像を (オーバーレイで) 開くと、大まかに説明するキャプションが表示されます。問題は、ユーザーがファイル (.doc、.pdf) をデスクトップにダウンロードしたり、作業した別のサイトにリンクしたりできるように、キャプション内にリンクが必要なことです。

私はFancyboxでそれを行うことができましたが、リンクがホバーされたときに望ましくないテキストを表示する方法に含まれています(ブラウザの黄色のツールチップ)。

コードは次のとおりです。

<a class="group" rel="portfolio"
 href="../../images/pf_nat/cfcBig.png" title="Rédaction de plus de 300 articles. <a href='http://www.groupecfc.com/fr-Ca/' target='_blank'>Visiter le site</a>"><img src="../../images/pf_nat/tn_nat_cfcBig.gif" alt="" width="40" height="40"/></a>

この場合、それはあるサイトへのリンクです。

4

3 に答える 3

10

それがほとんどの「ライトボックス」プラグインのようなものである場合、たとえば次のように文字エンティティを使用する必要があると思います。

<a href="test.html">hello</a>

になるだろう

&lt;a href=&quot;text.html&quot;&gt;hello&lt;/a&gt;

これをタイトルタグに入れるとリンクします。

http://en.wikipedia.org/wiki/List_of_XML_and_HTML_character_entity_referencesで HTML 文字エンティティの完全なリストを取得します。

于 2011-02-02T16:03:58.740 に答える
4

Thanks so much for this post! It helped me greatly, but then the tooltip showing up blew it all out of the water for me. THEN! I found an easy fix to that part also. Add a title attribute that contains a space (must have a space) to the img inside the anchor tag:

    <a title="&lt;p&gt;&lt;a href=&quot;http://www.mysite.com&quot; title=&quot;&quot;   target=&quot;_blank&quot;&gt;http://www.mysite.com&lt;/a&gt;&lt;/p&gt; " rel="prettyPhoto" href="http://www.mysite.com/wm/wp-content/themes/site/images/portfolio/image.jpg" style=""><img alt="Interactive" **title=" "** src="http://www.mysite.com/wm/wp-content/themes/site/images/portfolio/image.jpg"></a>

Wahoo! No Tooltip and the caption works with a link added.

于 2012-10-10T16:58:35.100 に答える
2

この PrettyPhoto のトピックと、写真のダウンロード リンクを追加できないことは、数年前から議論されてきました。私が知る限り、元の著者がこれに対処していないことに驚いています....

現在、Joomla、WordPress などのプラグインとして使用されるいくつかのマッシュアップを含む、PrettyPhoto のいくつかのバージョンがあります。

そこで、Joomla プラグインを使用して修正しました。Joomla なしでスタンドアロンで実行できます (私は Joomla を使用していないため)。ここで私の変更を見ることができます: http://www.catpin.com/prettyphoto

1) 実際の jquery.prettyPhoto.js ファイル 2) ダウンロードを実行する (ブラウザーのダウンロード ダイアログ ボックスを開く) PHP スクリプト。

これが役立つことを願っています...または少なくともそれができるという考えをあなたに与えます.

于 2012-11-03T00:02:44.980 に答える