Welcome To 'Scripters Paradise'
March 28, 2024, 02:14:19 pm
Welcome, Guest. Please login or register.
Did you miss your activation email?

Login with username, password and session length
News: Please Read Our Vision Statement.
Welcome To Our Newest Member: W14OK
 
  Home Help Search Gallery Flyfamilyguy WebSite Staff List Calendar Login Register  

Making a simple, HTML photo gallery

Pages: [1]   Go Down
  Print  
Author Topic: Making a simple, HTML photo gallery  (Read 1173 times)
0 Members and 1 Guest are viewing this topic.
guitarcrazy087
Administrator
Member
*
Offline Offline

Posts: 10


Loading...


View Profile WWW
« on: April 09, 2008, 05:46:00 pm »

Ok, well, a friend of mine was wanting me to show him how I had made a photo gallery, so I decided I'd just put a tutorial up here. 

Just a note, I haven't used this gallery in quite a while, so I'm a bit rusty.

1. THE PREPARING YOUR IMAGES

Select your photos that you want in your photo gallery.  I've never used the height and width image attribute, so I don't know how exactly they work, so I make my own thumbnails of the images I want in my photo gallery.  If you don't have a program to resize images with, download either the Gimp, or Irfan View.  I prefer Irfan View for resizing images. Your thumbnails should be no bigger than 200 px high or wide, or else your going to have a very retarded looking gallery.

2. THE HTML

Code:
<html>
<body>

<!-- this is where the images will be displayed -->
<iframe src="the url of your first image" name="display"></iframe>

<!-- This is where the thumbnails will appear -->

<table><tr>

<td><a href="your picture url" target="display"><img src="your thumbnail url" /></a><br />Your Caption</td>
<td><a href="your picture url" target="display"><img src="your thumbnail url" /></a><br />Your Caption</td>

</tr></table>

</body>
</html>

And that's all the code!  If you want more images in your gallery, just copy and paste one of the lines in the table and edit the appropriate attributes.

Basically all the IFrame does, is allows you to display an image or web page on another web page.  The "src" attribute that is attached to the IFrame tells it what to load when the page loads (in this case your first image).  The "name" attribute allows you to load images into the IFrame by using the "target" attribute on the links surrounding the thumbnails.

This should work.  If something doesn't work just ask me about it and I'll try to fix it.

Cheers!

Joe
« Last Edit: April 09, 2008, 08:21:05 pm by guitarcrazy087 » Report Spam   Logged

Share on Facebook Share on Twitter

GeekSlayer
Founder
Wannabe
*
Offline Offline

Posts: 9



View Profile WWW
« Reply #1 on: April 09, 2008, 08:40:32 pm »

VERY COOL!Thank You Partner!
Report Spam   Logged

CSS/HTML/SCRIPTING/PROGRAMMING/TUTORIALS  
Showcase Your Knowledge, Or Get Help!
Take part in our vision of a wonderful website by joining us at, scripters-paradise.co.nr/


Pages: [1]   Go Up
  Print  
 
Jump to:  

Bookmark this site! | Upgrade This Forum
SMF For Free - Create your own Forum

Powered by SMF | SMF © 2016, Simple Machines
Privacy Policy
Page created in 0.034 seconds with 15 queries.