2

Colorbox でスライドショーを作ろうとしています。残念ながら、画像の作成方法を制御できないため、画像にアンカー タグや rel= を配置することはできません。

私ができる最善のことは、次のようなものです。

<div id="cbImg" class="slideshow">
    <img src="file1.png" />    
    <img src="file2.png" />
    <img src="file3.png" />
    <img src="file4.png" />
</div>

画像タグには、高さ、幅、および alt タグを含めることができますが、動的に生成されます。私が制御できるのは、画像を囲む DIV タグだけです。画像を囲む他のタグ (p、div、span) がある場合とない場合があります。

私はこのようなものが欲しい：

<div id="cbImg" class="slideshow">
    <a href="file1.png" rel="slide" class="pop"><img src="file1.png" /></a>
    <a href="file2.png" rel="slide" class="pop"><img src="file2.png" /></a>
    <a href="file3.png" rel="slide" class="pop"><img src="file3.png" /></a>
    <a href="file4.png" rel="slide" class="pop"><img src="file4.png" /></a>
</div>

はい、これは CMS からのものです...いいえ、レンダリング方法を変更することはできません。スライドショーを作成しようとしています (可能であれば)。

4

2 に答える 2

0

これを行う別の方法は、ブログ記事を変換するXSLTを使用することです。ただし、画像がブログ投稿コンテンツ内にある場合、これは簡単ではありません（特に、Ektronは正規表現をサポートしていないXSLT 1.0を使用しているため）。

このサーバー側を実行したい場合は、おそらくコンテンツを取得して文字列を置き換える必要があります。または、jQueryソリューションを使用して、NodeJSを使用してサーバー側で実行することもできます。

于 2011-05-02T01:46:11.110 に答える
0

基本的に、JQuery を使用して、IMG タグの周りにアンカー タグを動的に作成することになりました。これにより、クラスと rel= を追加し、ColorBox オプションを使用する必要がありました。

アンカー タグの作成方法に関するヒントとして使用した回答の 1 つを次に示します。

jQuery: イメージ タグを A アンカー タグでラップする最も簡単な方法

于 2011-04-13T18:09:16.363 に答える