[Web4lib] AJAX/CSS and select drop down boxes

[Pons, Lisa (ponslm)]

I have IE6 on XP and it seems to work fine. 
 
I am guessing your div position is actually generated in the javascript:
 
One of the defaults is set early on, line 81:
this.oP.offsety = -5;
 
then called on Line 434:
  // get position of target textfield
 // position holding div below it
 // set width of holding div to width of field
 //
 var pos = _bsn.DOM.getPos(this.fld);
 
 div.style.left   = pos.x + "px";
 div.style.top   = ( pos.y + this.fld.offsetHeight + this.oP.offsety ) + "px";
 div.style.width  = this.fld.offsetWidth + "px";
 ----------------------------------------------------
 
Maybe try messing with that?
 
Lisa

________________________________

From: web4lib-bounces at webjunction.org on behalf of Stephen Graham
Sent: Thu 3/8/2007 5:25 AM
To: web4lib at webjunction.org
Subject: [Web4lib] AJAX/CSS and select drop down boxes



Hi - I'm using a Ajax library (AutoSuggest from
http://www.brandspankingnew.net/archive/2007/02/ajax_auto_suggest_v2.htm
l) to add some functionality to our ArticleFinder service. When a user
starts to type in a title in the "Journal title" field, a drop box
appears that suggests the desired title. I've got the server side script
working which retrieves and outputs the data in XML, and I nearly have
the client side sorted too. The problem I am having can be seen at:

http://telos.london.edu/ajax/afTest.html

If you start to type in the journal title, a box appears underneath the
relevant field. In every other browser apart from Internet Explorer 6
(well, it works in IE7, Seamonkey and Opera) the box goes over the Date
drop down boxes. In Internet Explorer 6 the drop down fields stay on top
and the text in the Ajax generated box gets obsured by the boxes.

I must admit that CSS is not my strong point. I've been editing the CSS
file that comes with the ajax library, and the relevant sections seem to
be:

div.autosuggest ul
{
        list-style: none;
        border:1px solid #000;
        display: block;
        margin: 0 0 0 0;
        padding: 0;
        background-color: #FFFFFF;
}

div.autosuggest ul li a
{
        color: #000000;
        border: none;
        display: block;
        text-decoration: none;
        background-color: white;
        text-shadow: #000 0px 0px 5pm;
        padding: 0;
        width: 100%;
}

No matter what I seemt o do I cannot get IE6 to render this like the
other browsers do. Ny advice/suggestions would be most welcome!

Stephen
---------------------------
Stephen Graham
Electronic Library Team
Information Systems Division
London Business School
Regents Park, London NW1 4SA
Tel: +44 (0)20 7000 7631
Fax: +44 (0)20 7706 1897


______________________________________________________________________

This email has been scanned by the MessageLabs Email Security System
on behalf of the London Business School community.
For more information please visit http://www.messagelabs.com/email
______________________________________________________________________
_______________________________________________
Web4lib mailing list
Web4lib at webjunction.org
http://lists.webjunction.org/web4lib/