Menampilkan Gallery Photo dengan JQuery


Jika di web anda ada sebuah halaman untuk menampilkan gallery photo, tidak ada salahkanya  anda mencoba JQuery untuk menambahkan efek saat gambar di tampilkan. Untuk lebih jelasnya silahkan download file-file web nya.

DOWNLOAD

http://www.4shared.com/file/245732341/cde060e3/gallery.html

DEMO

http://labhouse.co.cc/index.php?page=gallery

CARA PENGGUNAAN

  1. Saya Asumsikan anda sudah menginstall software XAMPP untuk menjalankan file-file PHP nya.
  2. Jika sudah mendownlod, kemudian extrak file zip nya di folder misalnya C:\xampp\htdocs\gallery.
  3. Untuk menjalankannya buka browser dan masukan alamat http://localhost/gallery/
  4. Klik salah satu gambar.
  5. Selesai

PENJELASAN

Jika anda membuka file “index.php” dalam folder “gallery” ada beberapa langkah yang bisa dilakukan yaitu :

Include file-file javascript

<script src=”jquery.js”></script>

<script src=”jquery.bigPicture-pack.js”></script>

<script src=”jquer.bigPicture-min.js”></script>

<script src=”jquery.bigPicture.js”></script>

Include file-file CSS

<link rel=”stylesheet” type=”text/css” href=”css/core.css”/>

<link rel=”stylesheet” type=”text/css” href=”css/skin.css”/>

Cantumkan link gambar yang akan di tampilkan

<a href=”photo/1.jpg” name=”desc-01″ title=”Gambar1 “><img src=”photo/thumbs/t1.jpg”/></a>

Tambahkan fungsi javascript.

<script language=”javascript”>

$(‘a.info’).bigPicture({

‘enableInfo’: true,

‘infoPosition’: ‘top’

});

</script>

Sekian tutorial dari saya, semoga bermanfaat untuk anda : )

Depok, 20-03-2010

noname

Advertisements

7 Responses

  1. Boljug gan
    Keep post

    Like

  2. wah ane bener2 terbantu gan, makasih ya jquery-nya
    hanya Allah yang bisa membalas kebaikan agan

    Like

  3. samas2 mas…semoga bermanfaat..aamin 🙂

    Like

  4. boz klo buat slide show galery pakai PHP gmana ia makasi sebelumnya..

    Like

  5. wah mas makasih banyak blog ini sangat membantu sekali… saya salut dengan anda… ok banget…

    Like

  6. waaahhh.. sangat membantu nih !
    tapi mas kalo nampilin dari database gmn?
    trima kasih..

    Like

  7. @mas omen

    https://ri32.wordpress.com/2011/01/26/membuat-slideshow-gallery-gambar-dengan-php-dan-jquery/

    selain ini ada banyak cari di google dengan kata kunci :

    jqueryplugins.com slideshow

    @mas asep

    logikanya tinggal looping tampilkan data gambar/alamat gambar

    while ($row=…………){
    ?>

    <a href="” class=”info” name=”desc-01″ title=””><img src="”/>

    <?
    }

    @nief

    alhamdulilah terimakasih

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: