shah100 1 Report post Posted September 2, 2009 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "xhtml11.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Highslide JS</title><!-- 1 ) Reference to the files containing the JavaScript and CSS. These files must be located on your server.--><script type="text/javascript" src="highslide/highslide-with-gallery.js"></script><link rel="stylesheet" type="text/css" href="highslide/highslide-ie6.css" /><script type="text/javascript"> // override Highslide settings here // instead of editing the highslide.js file hs.graphicsDir = 'highslide/graphics/';</script><!-- 2) Optionally override the settings defined at the top of the highslide.js file. The parameter hs.graphicsDir is important!--><script type="text/javascript"> hs.graphicsDir = 'highslide/graphics/'; hs.align = 'center'; hs.transitions = ['expand', 'crossfade']; hs.fadeInOut = true; hs.outlineType = 'glossy-dark'; hs.wrapperClassName = 'dark'; hs.captionEval = 'this.a.title'; hs.numberPosition = 'caption'; hs.useBox = true; hs.width = 600; hs.height = 400; //hs.dimmingOpacity = 0.8; // Add the slideshow providing the controlbar and the thumbstrip hs.addSlideshow({ //slideshowGroup: 'group1', interval: 5000, repeat: false, useControls: true, fixedControls: 'fit', overlayOptions: { position: 'bottom center', opacity: .75, hideOnMouseOut: true }, thumbstrip: { position: 'above', mode: 'horizontal', relativeTo: 'expander' } }); // Make all images animate to the one visible thumbnail var miniGalleryOptions1 = { thumbnailId: 'thumb1' }</script></head><body><!-- 3) Put the thumbnails inside a div for styling--><div class="highslide-gallery"><!-- 4) This is how you mark up the thumbnail images with an anchor tag around it. The anchor's href attribute defines the URL of the full-size image. Given the captionEval option is set to 'this.a.title', the caption is grabbed from the title attribute of the anchor.--> <a class='highslide' id="thumb1" href= 'images/thumbstrip11.jpg' title="Two cabins" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src= 'images/thumbstrip11.thumb.png' alt=''/></a> <div class="hidden-container"> <a class='highslide' href='images/thumbstrip12.jpg' title="Patterns in the snow" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src='images/thumbstrip12.thumb.png' alt=''/></a> <a class='highslide' href='images/thumbstrip13.jpg' title="Cabins" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src='images/thumbstrip13.thumb.png' alt=''/></a> <a class='highslide' href='images/thumbstrip14.jpg' title="Old stone cabins" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src='images/thumbstrip14.thumb.png' alt=''/></a> <a class='highslide' href='images/thumbstrip15.jpg' title="A litte open water" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src='images/thumbstrip15.thumb.png' alt=''/></a> <a class='highslide' href='images/thumbstrip16.jpg' title="Dipper" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src='images/thumbstrip16.thumb.png' alt=''/></a> <a class='highslide' href='images/thumbstrip17.jpg' title="Dipper" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src='images/thumbstrip17.thumb.png' alt=''/></a> <a class='highslide' href='images/thumbstrip18.jpg' title="Mountains" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src='images/thumbstrip18.thumb.png' alt=''/></a> <a class='highslide' href='images/thumbstrip19.jpg' title="Birch trees" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src='images/thumbstrip19.thumb.png' alt=''/></a> <a class='highslide' href='images/thumbstrip20.jpg' title="Highland woods" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src='images/thumbstrip20.thumb.png' alt=''/></a> <a class='highslide' href='images/thumbstrip21.jpg' title="Frozen lake" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src='images/thumbstrip21.thumb.png' alt=''/></a> <a class='highslide' href='images/thumbstrip22.jpg' title="Spring in the mountains" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src='images/thumbstrip22.thumb.png' alt=''/></a> <a class='highslide' href='images/thumbstrip23.jpg' title="Spring in the mountains" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src='images/thumbstrip23.thumb.png' alt=''/></a> <a class='highslide' href='images/thumbstrip24.jpg' title="Fjord landscape" onclick="return hs.expand(this, miniGalleryOptions1)"> <img src= 'images/thumbstrip24.thumb.png' alt=''/></a> </div></div></body></html> aku refer yg ongbok bagi tu.. Quote Share this post Link to post Share on other sites
shah100 1 Report post Posted September 2, 2009 http://www.komputermalaysia.com/v2/demo/html/...jadi lebih kurang camni la Quote Share this post Link to post Share on other sites
OngBok_1 2 Report post Posted September 2, 2009 ok..ko download skrip nie. scan dulu mana tau ada virus.aku tak scan lagi.http://komputermalaysia.com/download/imageshow.zipdalam tu ada 3 folder. buka folder html untuk lihat contoh.run fail index.html untuk tengok demo.Cara nak pinda.buka folder image, ko tengok dalam tu ada beberapa fail gambar.delete suma fail tu dan ganti dengan yang ko punyai. aku bagi contoh;file1.jpg (500x375)file1-thumb.jpg (72x50)file2.jpg (500x400)file2-thumb.jpg (72x52)dan begitulah seterusnya.Lepas tu buka folder html.edit fail index.htmlcari nama dan lokasi image, tukar supaya sesuai dengan ko punye.ko boleh tambah tag atau buang tag yang tak perlu.save fail index.htmltest dulu sebelum upload. ko kena upload semua sekali 3 folder tadi.itu saja.ok. Quote Share this post Link to post Share on other sites
akuccputsedut 147 Report post Posted September 2, 2009 mak oii abg shah pakai ler Code: ler letak code tuh..hihihihihi...errmmm tak sempat nak cuba lagi tapi aku rasa ongbok bagi tuh ok laa...try dulu ler..ym ngan ongbok senang skit...hihihihihi Quote Share this post Link to post Share on other sites
shah100 1 Report post Posted September 2, 2009 mekasih ongbok...ni aku cubaa Quote Share this post Link to post Share on other sites
shah100 1 Report post Posted September 2, 2009 ongbok..kenapa bila buka kat frontpage pastu bila nak preview file index tu ade error scrip,tak leh nak preview Quote Share this post Link to post Share on other sites
OngBok_1 2 Report post Posted September 2, 2009 cuba buka fail index.html dengan wordpad.edit dari situ Quote Share this post Link to post Share on other sites
shah100 1 Report post Posted September 2, 2009 macam mana pulak nak negok preview..kalau dah siap buat Quote Share this post Link to post Share on other sites
OngBok_1 2 Report post Posted September 2, 2009 double click jer fail index.html Quote Share this post Link to post Share on other sites
shah100 1 Report post Posted September 3, 2009 mekasih ongbok...berjaya jua akhirnye Quote Share this post Link to post Share on other sites
shah100 1 Report post Posted September 14, 2009 ongbok...napa kalau buka fail index lam kau bagi tu jadi..tapi bila masukan lam frame yg aku wat tu bila priviu kotak2 kecik tu tak kuar..kena klik kotak besar tu baru kotak kecik kuar Quote Share this post Link to post Share on other sites