Jump to content

Lightbox and fading text html question


Yivgeni
 Share

Recommended Posts

Hi!I know lightbox is not an html topic, but my question is, I believe, html related. Now, I know how to put the effect in my gallery, and I know how to group them so that when clicking on an image it opens and when clicking on the next button it shows the rest of the image "family". My question is this; how can I program the website in such a way that I will have one image to stand for say, apples, and when activated the viewer will be able to click next and go through 20 images that would not otherwise appear on the website?Example:(I am not trying to advertise, just this is the only way I can explain it)http://yivgeni-art.com/portfolio.html , lets say you click the paintings image, it goes to the gallery and when I click on the first image I can scroll through all of them without exiting the lightbox. Now, is there a way to enter the lightbox as soon as I click the paintings image without going to the gallery at all? Question 2;http://www.thedrakehotel.ca/ This website has a cool bit of white text at the bottom of the large image that fades and new text appears. It seems very simple, but me being a little dense html-ly I can't understand how to make it. The source of the site has this code for the text: <li style="display: list-item;"><span class="quote">"Big exuberant flavours are [Chef] Rose's signature... [Drake’s] kitchen is right on the mark..."</span> - <span class="source">Joanne Kates, The Globe and Mail</span></li> So, how would one reproduce such an effect? Thanks in advance!

Link to comment
Share on other sites

I know how to group them so that when clicking on an image it opens and when clicking on the next button it shows the rest of the image "family".
I think you should be able to do it the same way, but in each of the images that you don't want seen initially, just put style="display:none;". You could also do it in an external style sheet. .hiddenImg { display:none; }and give each image the class="hiddenImg". That would be the preferred way. Edited by music_lp90
Link to comment
Share on other sites

Thank you, this helps! I will try it out now. Any idea about the text from the other website that I have linked?
http://www.btinternet.com/~st_rise/main/mainfram.htmThis is what your looking for. Of course you'll have to edit it to your liking but it's still the same. BTW This is a great website to find all the scripts you need ^.^
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...