SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Addict
    Join Date
    Nov 2008
    Location
    Thailand
    Posts
    329
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Popup window advice needed

    Hi,

    I'm in the process of updating/unobtrusifying my gallery website.

    The html for the thumbnail links is generated in PHP from a database.

    In javascript I want to disable the thumbnail links' default behaviour and instead open up the hi-res image along with relevant details in a PHP pop-up window.

    I need to pass an identifier to popup.php and wondered if it was 'a okay' to add a 'picId' property to my html as follows and then construct a URL something along the lines of 'popup.php?imageId=' + imgLink[x].getAttribute('picId').

    Code:
    <li>
      <a href="ASSETS/Hires/Torosaurus.jpg" picId="1">
        <img src="ASSETS/Thumbs/Torosaurus.jpg" alt="Torosaurus"
        <span>Torosaurus</span>
      </a>
    </li>
    Is the above idea a bad idea semantically or just a bad idea fullstop.

    Thanks

    RLM

  2. #2
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,116
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    Hi,

    I don't think classes and id's are meant to start with numbers - could be for supporting older browsers, or they may not be styled correctly with CSS selectors.

    HTML5 has introduced the idea of data attributes which could also be used when you need more than the id / class allow.
    John Resig - HTML 5 data- Attributes

    Basically it's ok to add any attribute for attaching extra data to an element by prefixing with 'data-'

    Code:
    <a href="ASSETS/Hires/Torosaurus.jpg" data-id="1">

  3. #3
    SitePoint Addict
    Join Date
    Nov 2008
    Location
    Thailand
    Posts
    329
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    That's spot on Mark. Thanks a lot


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
  •