Results 1 to 9 of 9

Thread: Image w/ description tooltip

  1. #1
    Join Date
    Feb 2006
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Image w/ description tooltip

    Hello,

    This is really good script.
    Can image be shown on top left corner of page?

    Thank you.
    Armis.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,137
    Thanks
    44
    Thanked 3,231 Times in 3,192 Posts
    Blog Entries
    12

    Default

    Probably.
    Warning: Please include a link to the DD script in question in your post. See this thread for the proper posting format for asking a question.
    PLEASE: Include the URL to your problematic webpage that you want help with.
    - John
    ________________________

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

  3. #3
    Join Date
    Feb 2006
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I'm very sorry.
    Here is the link to script Image w/ description tooltip:
    http://www.dynamicdrive.com/dynamici...agetooltip.htm

    Can image be shown on top left corner of page instead of middle of page?

    Thank you for any help.
    Armis.

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,137
    Thanks
    44
    Thanked 3,231 Times in 3,192 Posts
    Blog Entries
    12

    Default

    Find this bit in the script:

    Code:
    	if ((mouseX+offX+tpWd)>winWd) 
    		tipcss.left = (ns4)? mouseX-(tpWd+offX): mouseX-(tpWd+offX)+"px";
    	else tipcss.left = (ns4)? mouseX+offX: mouseX+offX+"px";
    	if ((mouseY+offY+tpHt)>winHt) 
    		tipcss.top = (ns4)? winHt-(tpHt+offY): winHt-(tpHt+offY)+"px";
    	else tipcss.top = (ns4)? mouseY+offY: mouseY+offY+"px";
    Make it like so:

    Code:
    	if ((mouseX+offX+tpWd)>winWd) 
    		tipcss.left = (ns4)? 10: 10+"px";
    	else tipcss.left = (ns4)? 10: 10+"px";
    	if ((mouseY+offY+tpHt)>winHt) 
    		tipcss.top = (ns4)? 10: 10+"px";
    	else tipcss.top = (ns4)? 10: 10+"px";
    The number 10 is how far from the top and left of the page the image will be. Use any number you like for either, just make sure all red 10's (top position) are set to the same number and all green 10's (left position) are set to the same number. Having four of each is to account for different browsers and different positions on the page for the triggering event.
    - John
    ________________________

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

  5. #5
    Join Date
    Feb 2006
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thank you, John.

    Now image is on top left corner, but it was better with original script.
    Only image has overlaps with <select> elements and CSS. You mentioned that is 'known bug/feature of IE'.
    You can see problem here.

    Can it be fix (hide <select> elements, CSS) for this script?

    Thank you.
    Armis.

  6. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,137
    Thanks
    44
    Thanked 3,231 Times in 3,192 Posts
    Blog Entries
    12

  7. #7
    Join Date
    Feb 2006
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I tried to use:

    document.getElementById('boxOne').style.visibility='hidden';
    document.getElementById('boxOne').style.visibility='visible';
    if (document.all){document.getElementById('boxOne').style.visibility='hidden'};

    in code and did not work.

    Also <div> did not work in <body>

    <div onMouseover="if (document.all&&!window.opera){document.all('boxOne').style.visibility='hidden'};ddrivetip('Here is a tooltip that displays underneath the below dropdown')" onMouseout="hideddrivetip();if (document.all&&!window.opera){document.all('boxOne').style.visibility='visible'};"></div>

    Here is a page

    Can you tell what is missing?

    Thank you for your help.
    Armis.

  8. #8
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,137
    Thanks
    44
    Thanked 3,231 Times in 3,192 Posts
    Blog Entries
    12

    Default

    Your head was fine, so here is the updated body, works here.

    Code:
    <body>
    <table width="500" cellspacing="4" cellpadding="4">
      <tr>
        <td></td>
      </tr>
      <tr>
        <td></td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td align="center"><select name="boxOne">
    <option value="1">White</option>
    <OPTION value="2">Brown</OPTION>
    <option value="3">Black</option>
    </select></td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>
    <table width="270" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="100" height="30" align="left" valign="middle"><span class="style8">Available color:</span></td>
        <td width="170" height="30" align="left" valign="middle"><table width="90" height="20" border="1" cellpadding="0" cellspacing="0" bordercolor="#CCCCFF">
           <tr onmouseover="hideShowSelect('boxOne', 'boxTwo');" onmouseout="hideShowSelect('boxOne', 'boxTwo');">
             <th scope="col"><a href="http://www.lavinialingerie.com/CTGY/613" onmouseover="doTooltip(event,0)" onmouseout="hideTip()"><img src="../Merchant2/graphics/00000001/fsaw.jpg" alt="Angel White" width="30" height="20" border="0"></a></th>
             <th scope="col"><a href="http://www.lavinialingerie.com/CTGY/613" onmouseover="doTooltip(event,1)" onmouseout="hideTip()"><img src="../Merchant2/graphics/00000001/fsmp.jpg" alt="Midnight Passion" width="30" height="20" border="0"></a></th>
             <th scope="col"><a href="http://www.lavinialingerie.com/CTGY/613" onmouseover="doTooltip(event,2)" onmouseout="hideTip()"><img src="../Merchant2/graphics/00000001/fsmd.jpg" alt="Mocha Delight" width="30" height="20" border="0"></a></th>
           </tr>
         </table></td>
      </tr>
    </table>
    </td>
      </tr>
    </table>
    <table width="500" cellspacing="4" cellpadding="4">
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td align="center"><select name="boxTwo">
    <option value="1">White</option>
    <OPTION value="2">Brown</OPTION>
    <option value="3">Black</option>
    </select></td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
    </table>
    <div id="tipDiv" style="position:absolute; visibility:hidden; z-index:100"></div>
    </body>
    </html>
    - John
    ________________________

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

  9. #9
    Join Date
    Feb 2006
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks, your are a life saver

    Armis.

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
  •