Forums

leoniander

Hello guys/gals ...

I am building a homepage... now i am rather a beginner than a profesional. I have a problem finding a nice free photo album gallery(can be css or jquary ... except flash) that i could intigrate into my homepage, but it seems i cant find many of nice gallerys that support albums. So i wonder if you could paste a few links and point me in the right direction. I would be very grateful...

tnx in advance,

Leoniander

Ben_Derby

Hey,

Most people use sliders on the home page. An example of this is the Nivo Slider (http://nivo.dev7studios.com/ "Nivo Slider").

But if you do want a gallery then a good on is Simple Viewer(http://www.simpleviewer.net/products/ "Simple Viewer").

Ben

jozsef

Take a pick:

http://coffeescripter.com/code/ad-gallery/#ad-image-0

http://galleria.io/

http://www.buildinternet.com/project/supersized/ (full screen)

http://www.professorcloud.com/mainsite/carousel.htm (3D)

http://www.meadmiracle.com/SlidingGalleryDemo1.htm (3D)

http://www.smoothdivscroll.com/#quickdemo (scroll on hover)

http://www.addyosmani.com/resources/shinetime/

http://manos.malihu.gr/tuts/sideways_jquery_fullscreen_image_gallery.html

http://workshop.rs/projects/coin-slider/

leoniander

tnx for a fast respond... but i am searching for a bit more advance gallery that has an ability to hold multiple albums in one galery

meaning: u have many albums u can pick and then at each pick u can check pictures of that album for example: http://www.tn3gallery.com/ like this but free

if u can place some ideas at that matter ... i would be greatful again

best regards,

Leoniander

jozsef

So the thumbs are only the first image from an album? If yes, then you could use a simple slider plugin, and a list of sliders.The first slider should be shown and the rest hidden.When you click on a thumb the hidden slider with the same index as the clicked thumb's index fades in and replaces the actual slider.

http://wowslider.com/jquery-banner-rotator-catalyst-fade-demo.html

jozsef

HTML:

    <div id="albums">
    <ul id="slider1">
                 <li>...</li>
    </ul>
    <ul id="slider2">
                 <li>...</li>
    </ul>
    <ul id="slider3">
                  <li>...</li>
    </ul>
</div>

...

JS:
$('#thumbs li').click(function() {
var index = $('#thumbs li').index($(this))
$('ul','#albums').eq(index).fadeIn().siblings(':visible').fadeOut();
})

treehouse : what would you like to learn today?

Forums

Photo album gallery!