SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot
    Join Date
    Mar 2008
    Posts
    129
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Need to display "popup box", trying to use <span>

    Hey all.

    I'm trying to display a "popup box" when hovering over a link with the link being inside a table cell.

    The code would look like this:

    <table>
    <tr>
    <td>
    <a href="#">Link Text</a>
    <span id="uniqueID" style="display: none;position: relative; left: 100px;height:300px;width: 400px></span></td>
    <td>&nbps;</td>
    </table>

    When I "toggle the <span>", the table cell expands with it. I've tried changing it to "block" and also "inline", but I get the same result. The difference between the two being inline "hugs the text".

    What I want to accomplish is something like www.cnet.com, where the links display a "popupURL", I don't want to use popupURL though. When you hover over a link, a "box" appears with the page data inside.

    Example of CNet: http://www.download.com/3120-20_4.ht...eware&tag=srch

    The "Link Text" is inside a table, no way around that as it is data returned from the DB with X records.

    Any ideas?

    Dean

  2. #2
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I would have thought that the <span> would have to be absolutely positioned relative to the <td>

    i.e. you should set the span to display:block; and position:absolute; and then make <td> position:relative;.
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)

  3. #3
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Why use a table for this though?

  4. #4
    SitePoint Zealot
    Join Date
    Mar 2008
    Posts
    129
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Dan Schulz View Post
    Why use a table for this though?
    I'm using a table because there are X records returned from a search. The search results are part numbers and different fields associated with them. When the user hovers over the part number, I want to display the detail of that part in a "popup area", this will avoid having to display that data in a fixed area on the page.

    As for using a <span> in a table, I'm trying to get something that works. What is meant by making the table td relative?

    I set the z-index to 99 so it would be above the table itself, but the problem is that when the span "expands", it also expands the table td area.

    ...


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
  •