SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Oct 2004
    Location
    logan
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    check box with an image?

    Hi all...
    I would like to create a page with 4 pictures on it and a next button. When the user clicks on a picture, I would like that picture to act like an input field to a form of type checkbox. (i.e.. they can select 1 to 4 of the images and then click on the next button where I can process the their choices... I was going to use javascript to swap out the images onClick so that they look clicked...) I tried using the type="image" but that returns coordinates into the image. Is there a way I can sort of stick an image on top of a checkbox? possibly using css?
    here's what I tried so far.


    <style>
    input.coolBox
    {
    background-image: url(../images/checkMark.gif);
    }
    </style>

    <form action="dealWithStuff.cfm" method="post">

    <input type="image" src="../images/checkMark.gif" name = "image" value="yes" /><br />
    <input class="coolBox" type="checkbox" value="yes" name="box" />myJob <br />
    <input type="submit" value = "Next" />

    </form>


    I was hoping the <input> of class coolBox would be a picture.... help?
    Thanks
    Last edited by forumBrowser; Oct 28, 2004 at 09:07.

  2. #2
    SitePoint Member
    Join Date
    Oct 2004
    Location
    Cambridge, UK
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Not sure about putting an image over a check box. You can definitely use a script to check a check box when an image is clicked. Following that line you could maybe have the check boxes in the code but hide them from the user in their browser using CSS? That way their values would still get submitted when the user clicked the submit button . . .

  3. #3
    SitePoint Member
    Join Date
    Oct 2004
    Location
    logan
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks APS,
    that's a solution I think I can manage at least


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
  •