SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Evangelist
    Join Date
    May 2005
    Location
    Houston, Texas, USA
    Posts
    418
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Problem with fields in front of popup

    I don't know what my problem is. I couldn't get any help in HTML forum, so I'm trying here now.

    I have a javascript popup calendar (Epoch). When you click on the date field, the two appt time fields below it appear on top of the popup. Can anyone suggest a fix? This only happens in IE!



    Here is the code
    Code:
    	var bas_cal,dp_cal,ms_cal;      
    window.onload = function () {
    	dp_cal  = new Epoch('epoch_popup','popup',document.getElementById('popup_container'));
    };
    Last edited by Chri; Nov 10, 2006 at 14:30.
    Opportunity favors the prepared mind.

  2. #2
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,810
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    IE puts select lists in front of everything else on the page. You need to either hide the select lists when the calendar pops up or move them so that they don't overlap.

    Moving them into an iframe would also fix the problem for IE but as Opera has the same problem with iframes that IE has with select lists it would just be transferring the problem to a different browser if you do that.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  3. #3
    SitePoint Evangelist
    Join Date
    May 2005
    Location
    Houston, Texas, USA
    Posts
    418
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks. Can you give me an idea of how I might hide the select list upon popup? Would this be a javascript?
    Opportunity favors the prepared mind.

  4. #4
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,810
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    To hide them both you need:

    document.getElementByID('SecondChoiceTime').style.display = 'none';
    document.getElementByID('ThirdChoiceTime').style.display = 'none';

    To show them again use 'block' in place of 'none'.

    This needs to be added around the code that makes the calendar appear and disappear which will probably be somewhere inside the Epoch classes Javascript.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">


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
  •