0

<img>タグの代わりにタグからキャプションを取得する方法はあり<a>ますか?

たとえば、Html:

<a rel="fancybox" href="#">
<img src="ball.jpg" title="this is the caption i want to show in fancybox" alt="alt text here" />
</a>

<a rel="fancybox" href="#">
<img src="ball2.jpg" title="this is the caption2" alt="alt text here" />
</a>

<a rel="fancybox" href="#">
<img src="ball3.jpg" title="this is the caption 3" alt="alt text here" />
</a>

私はこれを試しましたが、うまくいきません: JQuery:

            $("a[rel=fancybox]").fancybox({
                'transitionIn': 'elastic',
                'transitionOut': 'elastic',
                'titlePosition': 'inside',
                'titleFormat': function (title, currentArray, currentIndex, currentOpts) {
                    title = $(this).find("img").attr("title");
                    return '<span>' + title + '</span>';
                }
            });
4

3 に答える 3

1

ファンシーボックス v1.3.4 の場合titleFromAlt、基本的にファンシーボックスのタイトルをタグの属性 (属性ではないalt)に設定する API オプションを使用するだけです。imgtitle

<a rel="fancybox" href="#">
 <img src="ball.jpg"  alt="this is the caption i want to show in fancybox" />
</a>

次に、スクリプト:

            $("a[rel=fancybox]").fancybox({
                'transitionIn' : 'elastic',
                'transitionOut': 'elastic',
                'titlePosition': 'inside',
                'titleFromAlt' :  true 
            });

このオプションの詳細と、fancybox v1.3.2+ でのタイトルの仕組みについては、こちらをご覧ください

#EDIT :タグtitleから属性を強制的に読み取るには、次のようなimgAPI オプションを使用しますonStart

        $("a[rel=fancybox]").fancybox({
            'transitionIn' : 'elastic',
            'transitionOut': 'elastic',
            'titlePosition': 'inside',
            'onStart' : function(currentArray,currentIndex){
               var obj = currentArray[ currentIndex ];
               this.title = $(obj).find('img').attr("title");
            }
        });
于 2012-07-19T07:07:42.603 に答える
0

これを試して:

$("img[title=fancybox]").fancybox({
            'transitionIn': 'elastic',
            'transitionOut': 'elastic',
            'titlePosition': 'inside',
            'titleFormat': function (title, currentArray, currentIndex, currentOpts) {
                title = $(this).find("img").attr("title");
                return '<span>' + title + '</span>';
            }
        });
于 2012-07-19T06:46:49.037 に答える
0

これを試して -

      $("a[rel=fancybox]").fancybox({
            'transitionIn': 'elastic',
            'transitionOut': 'elastic',
            'titlePosition': 'inside',
            'titleFormat': function (title, currentArray, currentIndex, currentOpts) {
                title = $(currentArray[currentIndex]).find('img').attr('title');
                return '<span>' + title + '</span>';
            }
        });

または、単にパラメーターを渡すことができます'titleFromAlt' : true

于 2012-07-19T07:03:39.277 に答える