Page 1 of 2 12 LastLast
Results 1 to 10 of 11

Thread: Photo Album Script - Help with Formatting

  1. #1
    Join Date
    Nov 2004
    Posts
    39
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Photo Album Script - Help with Formatting

    I'm using the Photo Album script here:
    http://www.dynamicdrive.com/dynamici...photoalbum.htm

    I need to change 2 things and I'm getting an error. They are:

    1. How to format the "optional_title_attribute", "optional_text_description"

    2. If I want the page numbers (navlinks) to display at the top and bottom how do I do this? I tried moving the script to the top but I'm getting an error.

    Thanks!

  2. #2
    Join Date
    Sep 2004
    Location
    Tallahassee, FL USA
    Posts
    264
    Thanks
    71
    Thanked 2 Times in 2 Posts

    Default Adding page numbers to top

    John gave me instructions on adding page numbers to the top here:

    http://www.dynamicdrive.com/forums/s...ht=photo+album

    Deborah
    Deborah Whipp
    Web Designer
    Tallahassee, FL
    www.DWWebDesigns.com

  3. #3
    Join Date
    Nov 2004
    Posts
    39
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks Deborah, that helped.

    One more thing. When I enter a title in the section where it should go, the title doesn't display. What am I doing wrong?

    Here's an example of what I have:

    //Specify images:
    //galleryarray[x]=["path_to_image", "optional_title_attribute", "optional_text_description", "optional_link"]
    var galleryarray=new Array()
    galleryarray[0]=["http://www.lirvaproductions.com/images/Client_YAS.gif", "YAS", "The Youth Awareness and Safety Program", "http://www.youthawarenessandsafety.com"]

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Generally, you have to allow enough height here:

    Code:
    .slideshow{ /*CSS for DIV containing each image*/
    float: left;
    width: 200px;
    height: 270px;
    }
    in the style section for there to be room for the description as well as the image. Say your image is 270px high, you would need about another 30px for a one line description, so make it 300px. Otherwise, even if the description is used, it will not be visible.

    If this is not what is happening, please provide a link to your page.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Sep 2004
    Location
    Tallahassee, FL USA
    Posts
    264
    Thanks
    71
    Thanked 2 Times in 2 Posts

    Default

    Sorry, I didn't use titles, so I can't help you there.
    Deborah
    Deborah Whipp
    Web Designer
    Tallahassee, FL
    www.DWWebDesigns.com

  6. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Since, dmwhipp and I cross posted, you may miss my suggestion.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  7. #7
    Join Date
    Nov 2004
    Posts
    39
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    ok!! I added more pixels to the height but it's still not showing. Here's the css I'm using:

    .slideshow{ /*CSS for DIV containing each image*/
    float: left;
    margin-left: 6px;
    width: 320px;
    height: 280px;
    color: #0076ae;
    font-size: 8pt;
    font-weight: bold;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    }

    .slideshow img{ /*Change "auto" below to a number (ie: 200px) to hard code dimensions of album images*/
    width: 260px;
    height: 200px;
    border: none;
    }

    Here's the page:

    http://www.lirvaproductions.com/portfolio_NEW.html

    Thanks so much!!

  8. #8
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    What are you referring to, I see 'titles' (like:The Youth Awareness and Safety Program, for example) under each of the three images and when I hover over the images I see title attributes pop up at the mouse pointer.

    I think either you fixed it since you posted, or you fixed it but, because you had the old version cached, cannot see the changes.

    Or possibly you expected the 'title' to appear above the image? The title, is a tool tip type thing onmouseover.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  9. #9
    Join Date
    Nov 2004
    Posts
    39
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    You're right!! I thought it would appear above the image.

    Is there a way that I can have the title appear above the image?

  10. #10
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    For that, replace the existing function buildimage(i) with this one (additions red):

    Code:
    function buildimage(i){
    var tempcontainer=galleryarray[i][3]!=""? '<a href="'+galleryarray[i][3]+'" target="'+href_target+'">' : ""
    tempcontainer+='<span class="slottitle">'+galleryarray[i][1]+'<\/span><br \/><img src="'+galleryarray[i][0]+'" border="1" title="'+galleryarray[i][1]+'">'
    tempcontainer=galleryarray[i][3]!=""? tempcontainer+'</a>' : tempcontainer
    tempcontainer=galleryarray[i][2]!=""? tempcontainer+'<br \/>'+galleryarray[i][2] : tempcontainer
    return tempcontainer
    }
    You can control the style of the 'title' from the stylesheet, example:

    Code:
    .slottitle {
    color:#000;
    background-color:#fff;
    text-decoration:none;
    }
    The height of .slideshow will still need to be great enough to allow for this added content.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •