0

NO CMS サイトでこのアイデアを思いつきました... 約 50 枚の画像があり、一度にすべて表示することはできません。SOアイデアは、最初の15を表示してから次をクリックし、それらを非表示にして次の15を表示するなどです。

ajax またはウィット php と css でそれを行うのは難しいですか?

カウントし、隠しクラスを追加し、?

またはそれを行う別の方法... phpまたはjQueryで、クラス「画像」を使用してdivの最初の15要素を取得し、クラスを追加する方法：showimage、次に[次へ]ボタンをクリックします：すべてのクラスshowimageを削除し、画像16～30

コードは次のようになります:

<div id="gallery2"> <!-- Gallery de photos --> 

<a href="ia/new_01.jpg" class="highslide" onclick="return hs.expand(this)">
<img src="timthumb.php?src=ia/new_01.jpg&amp;h=<?php echo $size ?>" title="Cliquer pour agrandir" 
alt="Pont Neuf - Ile de la Cité - Paris - France - Aquarelle <br> Conception personnelle"/></a>

<a href="ia/new_02.jpg" class="highslide" onclick="return hs.expand(this)">
<img src="timthumb.php?src=ia/new_02.jpg&amp;h=<?php echo $size ?>" title="Cliquer pour agrandir" 
alt="Studebaker Hawk - Concept rétro <br> Conception personnelle"/></a>

<a href="ia/new_03.jpg" class="highslide" onclick="return hs.expand(this)">
<img src="timthumb.php?src=ia/new_03.jpg&amp;h=<?php echo $size ?>" title="Cliquer pour agrandir" 
alt="Corvette - Concept rétro <br> Conception personnelle"/></a>

<a href="ia/new_04.jpg" class="highslide" onclick="return hs.expand(this)">
<img src="timthumb.php?src=ia/new_04.jpg&amp;h=<?php echo $size ?>" title="Cliquer pour agrandir" 
alt="Thunderbird - Concept rétro <br> Conception personnelle"/></a>

<a href="ia/new_05.jpg" class="highslide" onclick="return hs.expand(this)">
<img src="timthumb.php?src=ia/new_05.jpg&amp;h=<?php echo $size ?>" title="Cliquer pour agrandir" 
alt="Les autos de mon père <br> Conception personnelle"/></a>

何度も何度も.... 50枚の画像

4

1 に答える 1

0

このために ajax を必要としません。すべての画像の URL を JS 配列に入れることができ、[次へ] ボタンをクリックすると、現在の 15 枚の画像が非表示になり、配列から新しい 15 枚の画像が追加されます。その場でレンダリングします。そのため、画像はブラウザによってオンザフライでレンダリングされます。

var images=[]; // it'll contain images.
var ptr=0;
var length = 15;
function show(offset, count){
    for(var i=offset;i<offset+count;i++){
        // add image images[i] in the image container.
    }
}
function next(){
    // empty the image container
    ptr+=length
    show(ptr, length);
}

show(0, length); // initial call to display first chunk of images

次のボタンではnext、クリック ハンドラーとして関数を追加するだけです。

于 2012-09-27T05:17:53.713 に答える