Results 1 to 3 of 3

Thread: Image w/ description tooltip

  1. #1
    Join Date
    Jul 2007
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Image w/ description tooltip

    1) Script Title: Image w/ description tooltip

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

    3) Describe problem: Is it possible to use the above script binding to images in a database, for instace, an "Imagedata" column in a SQL Server 2005?

    Thanks

  2. #2
    Join Date
    Aug 2004
    Posts
    9,918
    Thanks
    3
    Thanked 969 Times in 957 Posts
    Blog Entries
    15

    Default

    Any JavaScript/ DHTML can essentially have its data dynamically generated from a database. It's just a matter of isolating the portions of the script that contains the data, and store it on the server side. In this case, the data is the following:

    messages[0] = new Array('red_balloon.gif','Here is a red balloon on a white background',"#FFFFFF");
    messages[1] = new Array('duck2.gif','Here is a duck on a light blue background.',"#DDECFF");
    messages[2] = new Array('test.gif','Test description','black','white');

    So I you'd want to store the image paths and text descriptions in your db, and dynamically output this portion of the JavaScript (the messages[] array), drawing the image path/ messages from the db. Using PHP, you may end up with something like:

    Code:
    echo "messages[0]=new Array('" . imagedata . ", '" . description . ", '" . bgcolor +"')';
    "
    "

  3. #3
    Join Date
    Jul 2007
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hello ddadmin,

    Thanks for the reply.
    I could easely change the pictures by changing the image path to the ones in my database.
    Now, I would like to display them in a Datalist (Visual Web Developer Tool) and I get stuck because I don't know how to address the onmouseover="doTooltip(event,0)" in the HTML.

    I have 8 events
    messages[0] = new Array('/images/picture1.jpg', 'width="70" height="70"');
    messages[1] = new Array('images/picture2.jpg','width="70" height="70"');
    messages[2] = new Array('images/picture3.jpg','width="70" height="70"');
    messages[3] = new Array('images/picture4.jpg',''width="70" height="70"');
    messages[4] = new Array('images/picture4.jpg',''width="70" height="70"');
    messages[5] = new Array('images/picture4.jpg',''width="70" height="70"');
    messages[6] = new Array('images/picture4.jpg',''width="70" height="70"');
    messages[7] = new Array('images/picture4.jpg',''width="70" height="70"');
    messages[] = new Array('images/picture4.jpg',''width="70" height="70"');

    Any Help?
    Regards
    PAti2005

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
  •