Web Design Forum: TUTORIAL: Creating photograph galleries using CSS, HTML and Lightbox - Web Design Forum

Jump to content

WDF
WDF Premium Memberships Reseller Hosting
Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

TUTORIAL: Creating photograph galleries using CSS, HTML and Lightbox A tutorial for beginners Rate Topic: -----

#1 User is offline   caraewilton 

  • Advanced Member
  • PipPipPip
  • Group: Members
  • Posts: 367
  • Joined: 24-October 08
  • Reputation: 0
  • Location:South Africa
  • Experience:Beginner
  • Area of Expertise:I'm Learning

Posted 08 December 2008 - 05:00 AM

I have recently written a tutorial on creating photograph galleries using CSS, HTML and Lightbox.

The tutorial is designed for beginners and provides step by step instructions of how to code the CSS and HTML required to lay out a basic photograph gallery. Slides are displayed simply using Lightbox.

I have attempted to use the simplest methods, however should anyone have suggestions which would make the tutorial easier, please let me know.

Creating Simple CSS photograph galleries

Cheers
Car
0

#2 User is offline   Sam Lester 

  • Dedicated Member
  • PipPip
  • Group: Members
  • Posts: 224
  • Joined: 06-December 08
  • Reputation: 0
  • Gender:Male
  • Location:London, UK
  • Experience:Intermediate
  • Area of Expertise:Web Designer

Posted 08 December 2008 - 04:24 PM

Nice tutorial!
0

#3 User is offline   Pedro 

  • Expert
  • PipPipPipPip
  • View gallery
  • Group: Members
  • Posts: 740
  • Joined: 30-November 08
  • Reputation: 62
  • Gender:Male
  • Location:London
  • Experience:Intermediate
  • Area of Expertise:Web Developer

Posted 09 December 2008 - 04:55 PM

Thank you so much
0

#4 User is offline   Th0mas 

  • Forum Newcomer
  • Pip
  • Group: Members
  • Posts: 17
  • Joined: 09-September 08
  • Reputation: 0
  • Location:Trondheim, Norway
  • Experience:Beginner
  • Area of Expertise:I'm Learning

Posted 27 January 2009 - 07:58 PM

Great tutorial! Will be using it soon.
0

#5 User is offline   MolotovRuss 

  • Web Guru
  • PipPipPipPipPip
  • Group: Members
  • Posts: 1,336
  • Joined: 30-December 07
  • Reputation: 14
  • Gender:Male
  • Location:Liphook, Hampshire
  • Experience:Advanced
  • Area of Expertise:Web Designer

Posted 29 January 2009 - 01:35 AM

WOuld it not be better if it was all in a list?

<ul>

<li><a><img /></a></li>

<li><a><img /></a></li>

<li><a><img /></a></li>

<li><a><img /></a></li>

<li><a><img /></a></li>

<li><a><img /></a></li>

</ul>

0

#6 User is offline   caraewilton 

  • Advanced Member
  • PipPipPip
  • Group: Members
  • Posts: 367
  • Joined: 24-October 08
  • Reputation: 0
  • Location:South Africa
  • Experience:Beginner
  • Area of Expertise:I'm Learning

Posted 29 January 2009 - 03:40 AM

Hi Russ

I have thought of doing it as a list, but I just could not think of any advantage or gain.

My aim was to create a gallery using the least amount of coding. By using a list, all it seemed to do, is add to the amount of coding required.

What does everyone else think?
0

#7 User is offline   pvcblue 

  • Dedicated Member
  • PipPip
  • Group: Members
  • Posts: 222
  • Joined: 15-January 09
  • Reputation: 0
  • Location:Dallas, Texas
  • Experience:Intermediate
  • Area of Expertise:I'm Learning

Posted 29 January 2009 - 05:47 AM

View Postcaraewilton, on Jan 28 2009, 21:40, said:

Hi Russ

I have thought of doing it as a list, but I just could not think of any advantage or gain.

My aim was to create a gallery using the least amount of coding. By using a list, all it seemed to do, is add to the amount of coding required.

What does everyone else think?



If your tutorial is how you got the gallery on the front of your page to work, why mess with it?
0

#8 User is offline   bocaj 

  • Retired
  • PipPipPipPipPip
  • View gallery
  • Group: Members
  • Posts: 3,402
  • Joined: 11-January 09
  • Reputation: 99
  • Gender:Male
  • Location:New Sarum
  • Experience:Web Guru
  • Area of Expertise:Entrepreneur

Posted 29 January 2009 - 06:14 AM

It's to do with content structure, and grouping related elements together, a list binds them. what impact it has on certain devices, and to search engines etc. though I'm not too sure.

But i don't think it's overly important, it seems to a preference thing.
0

#9 User is offline   pvcblue 

  • Dedicated Member
  • PipPip
  • Group: Members
  • Posts: 222
  • Joined: 15-January 09
  • Reputation: 0
  • Location:Dallas, Texas
  • Experience:Intermediate
  • Area of Expertise:I'm Learning

Posted 29 January 2009 - 06:22 AM

View Postbocaj, on Jan 29 2009, 00:14, said:

It's to do with content structure, and grouping related elements together, a list binds them. what impact it has on certain devices, and to search engines etc. though I'm not too sure.

But i don't think it's overly important, it seems to a preference thing.



OH ok I get it now! :rolleyes:
0

#10 User is offline   Scarlett 

  • Forum Newcomer
  • Pip
  • Group: Members
  • Posts: 3
  • Joined: 30-January 09
  • Reputation: 0
  • Experience:Beginner
  • Area of Expertise:I'm Learning

Posted 30 January 2009 - 11:57 AM

I am a beginner for anything website related and just checked it out. I like it and feel it will help me a lot in the future :good:
0

#11 User is offline   Lee Boyce 

  • Dedicated Member
  • PipPip
  • Group: Members
  • Posts: 136
  • Joined: 31-August 08
  • Reputation: 1
  • Gender:Male
  • Location:Scotland
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 30 January 2009 - 12:03 PM

Nice work, very detailed, i'm sure some folk will find it very useful!
0

#12 User is offline   Guezala 

  • Not an expert, just talk a lot...
  • PipPipPipPipPip
  • Group: Members
  • Posts: 1,504
  • Joined: 28-August 08
  • Reputation: 11
  • Gender:Female
  • Location:Midlands
  • Experience:Intermediate
  • Area of Expertise:Web Designer

Posted 30 January 2009 - 12:31 PM

Looking good...could have done with this a few days ago!

Any ideas how to get the mext button to appear? Athough a hand appears on hover of righthand top corner i have no next button...
0

#13 User is offline   caraewilton 

  • Advanced Member
  • PipPipPip
  • Group: Members
  • Posts: 367
  • Joined: 24-October 08
  • Reputation: 0
  • Location:South Africa
  • Experience:Beginner
  • Area of Expertise:I'm Learning

Posted 31 January 2009 - 03:21 AM

Wow, I am delighted people think this tutorial may be helpful.

View PostGuezala, on Jan 30 2009, 14:31, said:

Looking good...could have done with this a few days ago!

Any ideas how to get the mext button to appear? Athough a hand appears on hover of righthand top corner i have no next button...


Are you talking about on my tutorial or your own site.

If your own site, check that the next and before graphics have been copied into the right place.
0

#14 User is offline   Guezala 

  • Not an expert, just talk a lot...
  • PipPipPipPipPip
  • Group: Members
  • Posts: 1,504
  • Joined: 28-August 08
  • Reputation: 11
  • Gender:Female
  • Location:Midlands
  • Experience:Intermediate
  • Area of Expertise:Web Designer

Posted 01 February 2009 - 07:35 PM

LOL I thought I'd done it, but cos the lightbox css wasn't in the same folder...DOH!

Thanks :)
0

Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users