Results 1 to 4 of 4

Thread: Adding Text Below Enlarged Images

  1. #1
    Join Date
    Apr 2011
    Posts
    35
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default Adding Text Below Enlarged Images

    1) Script Title: Adding Text Below Enlarged Images

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...thumbnail2.htm

    3) Describe problem: Using Dreamweaver 8 to build my site. Using JS Query thumbnail viewer 2 for my thumbnail scripts.

    I did not want captions where my mouse hovers over the thumbnail. It was recommended to me to change the "title" attribute to "info". This is how it was configured:

    <a href="http://www.loftmidcentury.com/arco lamp 4.jpg" info="This is some product information!" rel="enlargeimage" rev="targetdiv:loadarea,trigger:mouseover,preload:yes,fx:fade"><img border="0" src="http://www.loftmidcentury.com/arco lamp 4.jpg" width="91" height="91"></a><br/>Arco Lamp

    There are no captions when I hover over the thumbnail but I would like to have text appear the enlarged images for product description.

  2. #2
    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

    As far as I know, info isn't a valid attribute in any DOCTYPE. Starting with HTML 5, the data hyphen attribute is, example:

    Code:
    <a href="http://www.loftmidcentury.com/arco lamp 4.jpg" data-info="This is some product information!" rel="enlargeimage" rev="targetdiv:loadarea,trigger:mouseover,preload:yes,fx:fade"><img border="0" src="http://www.loftmidcentury.com/arco lamp 4.jpg" width="91" height="91"></a><br/>Arco Lamp
    Whatever you use though the script needs to pick it up. One way to do that would be to edit the script (thumbnailviewer2.js) at around line #21 we see:

    Code:
    imghtml='<div>'+imghtml+((setting.enabletitle!='no' && $anchor.attr('title')!='')? '<br />'+$anchor.attr('title') : '')+'</div>'
    So let's say we're using data-info as I suggest. In that case we can change the above line to (changes highlighted - two places, scroll the code block to see the second one):

    Code:
    imghtml='<div>'+imghtml+((setting.enabletitle!='no' && $anchor.attr('data-info')!='')? '<br />'+$anchor.attr('data-info') : '')+'</div>'
    To do this you need to use a text editor. NotePad is fine. Or if you have another text editor that you like better, use it. Just open the thumbnailviewer2.js file with the editor, make the change and save the file.
    - John
    ________________________

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

  3. #3
    Join Date
    Apr 2011
    Posts
    35
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    Hi john,

    originally i used thumbnail viewer from DD and was asking for more assistance because my codes were all over the place but got no reply so i used a script from another forum which suggested jsquery. the person assisting me has gone above and beyond to help me so as to not be insulting i am deciding to continue using the script they've suggested. but because of their limited time i've tried to learn on my own but was unsuccessful so i am asking others to assist as well. i have sort of a deadline and don't want to pressure anyone.

    I'm still learning about scripts but i still wish to use what i have already. my apologies for the time you've taken to reply. i appreciate it greatly and don't mean to offend. is there a way for me to acheive text under my enlarged thumbnails WITHOUT HAVING CAPTIONS using what i'm using now?

  4. #4
    Join Date
    Apr 2011
    Posts
    35
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    my apologies john.

    i didn't read completely what you've suggested. i will attempt your suggested and test using the thumbnail viewer i already have (from jsquery).

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
  •