Results 1 to 3 of 3

Thread: Cool DHTML Tooltip -brings up text u type in...can it bring up images/logos??

  1. #1
    Join Date
    Aug 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Cool DHTML Tooltip -brings up text u type in...can it bring up images/logos??

    1) Script Title: :: Cool DHTML Tooltip

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

    3) Describe problem: There is no problem, this is a cool tip I have on the website. It works and brings up text that I type in. I'm just now wondering if it can be programmed/changed somehow to bring up images/logos when mouse rollovers the selected text (or another image). Please let me know. Thanks!!

    ~TerriTech

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,953
    Thanks
    43
    Thanked 3,195 Times in 3,157 Posts
    Blog Entries
    12

    Default

    Well, yeah. It doesn't need to be changed. You can just put the HTML tags for what you want in there, but it can get tricky, so a small change in how you use it is a good idea. At the end of the script, add this highlighted code as shown:

    Code:
     . . . tyle.left="-1000px"
    tipobj.style.backgroundColor=''
    tipobj.style.width=''
    }
    }
    
    document.onmousemove=positiontip
    
    ddrivetip.tips = [ // numbers are comments for reference, the tips are numbered in the order in which they appear, starting with 0
    	'What a wonderful sunny day!<br><img src="sunnyday.jpg" alt="">', //0
    	'<img src="somelogo.png" alt="">', //1
    	'This one\'s just text and has an escaped apostrophe in it' //2 - no comma after the last tip
    ];
    
    </script>
    Now instead of using (from step 3 on the demo page:

    Code:
    onMouseover="ddrivetip('JavaScriptKit.com JavaScript tutorials','yellow', 300)";
    onMouseout="hideddrivetip()"
    You can use (notice that ddrivetip.tips[0] is not quoted):

    Code:
    onMouseover="ddrivetip(ddrivetip.tips[0],'yellow', 300)";
    onMouseout="hideddrivetip()"
    That one will show the text and image from the 0 index of the newly created ddrivettip.tips array:

    Code:
    What a wonderful sunny day!<br><img src="sunnyday.jpg" alt="">
    For another you could do:

    Code:
    onMouseover="ddrivetip(ddrivetip.tips[1],'yellow', 300)";
    onMouseout="hideddrivetip()"
    It will show the 1 index one:

    Code:
    <img src="somelogo.png" alt="">
    And so on. You can add as many as you like to the ddrivetip.tips array. You don't have to use them all. Just remember they will be in order from 0 to however many you have, and remember not to put a comma after the last one.


    Another option would be to try:

    http://www.dynamicdrive.com/dynamici...agetooltip.htm
    - John
    ________________________

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

  3. #3
    Join Date
    Aug 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Thank you!

    Thank you John!

    Looks simple enough, I'll give it a try when I get a chance. Also BIG thanks for the other suggestion, don't know how or why I missed that one!

    Happy Coding!
    ~Terri

Similar Threads

  1. Cool DHTML tooltip - image in text
    By okerix in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 08-05-2010, 05:12 PM
  2. Cool DHTML Tooltip text and search engine bots
    By ChannelDave in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 05-31-2009, 09:30 PM
  3. Arrow in Fixed Tooltip script like in Cool DHTML Tooltip II
    By Null in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 03-01-2006, 03:23 PM
  4. Cool DHTML Tooltip - Need help with text format
    By sweetpeakate in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 02-10-2006, 05:53 PM
  5. Cool DHTML Tooltip II - Text won't appear
    By jclark120 in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 12-05-2005, 05:10 PM

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
  •