zurück zur Startseite
  


Zurück XHTMLforum > Webentwicklung (außer XHTML und CSS) > Javascript & Ajax
Seite neu laden Layer auf- und zublenden im IE.

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 18.01.2010, 16:54
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.02.2009
Beiträge: 17
powl0r befindet sich auf einem aufstrebenden Ast
Standard Layer auf- und zublenden im IE.

Hi,

und wieder hab ich nen Problem mit Javascript im IE. Im Firefox funktioniert das ganze...
Ich hab einen Layer mit einer height von 50px. Bei Klick in eine Checkbox vergrößere ich die height auf 350px und blende einen weiteren Layer innerhalb des Layers ein. Bei weiterem Klick in die Checkbox, verschwindet der eine Layer dann und der andere Layer geht wieder auf die 50px.

Hier mein CSS:

Code:
#kundendaten {
	background-color:#E4E9EE;
	border:1px solid #999999;
	bottom:506px;
	font-weight:bold;
	margin-right:10px;
	position:absolute;
	top:225px;
	width:532px;
	left:0px;
}

Code der Layer:

HTML-Code:
<div style="margin-top: 15px;"> 
<div id="kundendaten" style="height: 50px;">
<br />
<div align="left" style="padding-left:35px;">
<input id="kundendaten_checkbox" type="checkbox" onclick="javascript:kundendatenClicked();">&nbsp;<label for="kundendaten_checkbox">{kundendaten}: </label>
</div>
<br />
<div id="kundendaten_hide" style="visibility:hidden">
<table cellspacing="1" cellpadding="1" style="border: 1px solid rgb(153, 153, 153); background-color: rgb(228, 233, 238); margin-left: 35px;" class="middle_medium" align="left">
<!-- Kundeninfo -->
  <tr>
    <td colspan="4">

	  <table cellspacing="1" cellpadding="1" class="middle_medium" style="border:0px none transparent; width:100%;">
	    <tr style="background-color:#E4E9EE;">

          <th style="font-weight:bold; white-space:nowrap;">&nbsp;{t_user_portal_name}&nbsp;</th>
          <th style="font-weight:bold; white-space:nowrap;">&nbsp;{t_email}:&nbsp;</th>
          <th style="font-weight:bold; white-space:nowrap;">&nbsp;
		<select name="email_senden_funktion_vorlage" onChange="if (this.value != \'\') email_funktion_oeffnen(\'\', this.value, \'\', \'\'); else email_funktion_schliessen();"><option value="" style="font-weight:bold; color:#666666;">{t_kundendaten_email_box}</option></select>&nbsp;</th>
          <th style="font-weight:bold; white-space:nowrap;">&nbsp;{t_buyer_id}&nbsp;</th>

        </tr>
        <tr style="background-color:#FF5555;">

          <td style="font-weight:bold; white-space:nowrap;">&nbsp;<input type="text" name="edit_mitgliedsname"                   maxlength="80"  size="15"   value="Barzahlung" id="f_user_portal_name"> <img src="./images/lupe.png" border="0" alt="s" title="Suche nach Mitgliedsnamen" style="cursor:pointer;" onclick="var tmp = document.getElementById(\'f_user_portal_name\'); f_buyer_id_search(tmp.value, \'portal_name\');" />&nbsp;</td>
          <td colspan="2" style="font-weight:bold; white-space:nowrap;">&nbsp;<input type="text" name="edit_email" id="f_email"                          maxlength="80"  size="19"   value="Barzahlung" id="f_email" />&nbsp;</td>
          <td style="font-weight:bold; white-space:nowrap; text-align:center;">&nbsp;<input type="text" name="edit_kundennummer"                    maxlength="80"  size="13"   value="" id="f_buyer_id"> <img src="./images/lupe.png" border="0" alt="s" title="Suche nach Kundennummer" style="cursor:pointer;" onclick="var tmp = document.getElementById(\'f_buyer_id\'); f_buyer_id_search(tmp.value, \'id\');" />&nbsp;</td>
        </tr>
      </table>

      <div id="f_buyer_id_function_body" class="f_buyer_id_function_body_hidden"></div>

    </td>

  </tr>

<!-- Kunden-Adressen -->
  <tr style="background-color:#E4E9EE;"> 
    <th colspan="2" style="font-weight:bold; white-space:nowrap;">&nbsp;{t_bill_address}&nbsp;</th>
    <th colspan="2" style="font-weight:bold; white-space:nowrap;">&nbsp;{t_delivery_address}&nbsp;</th>

  </tr>
  <tr style="background-color:#E4E9EE;"> 
    <td colspan="4" title="" style="text-align:center;"><input type="hidden" name="adressen_aenderbar" value="1" /></td>

  </tr>
  <tr style="background-color:#FF5555;"> 
    <td style="white-space:nowrap;">&nbsp;{t_bill_name}&nbsp;</td>
    <td style="white-space:nowrap;"><input type="text" name="edit_rech_name" id="f_bill_name"      maxlength="80"  size="20" value=""> <img src="./images/lupe.png" border="0" alt="s" title="Suche nach Kundennamen" style="cursor:pointer;" onclick="var tmp = document.getElementById(\'f_bill_name\'); f_buyer_id_search(tmp.value, \'bill_name\');" /></td>
    <td style="white-space:nowrap;">&nbsp;{t_delivery_name}&nbsp;</td>

    <td style="white-space:nowrap;"><input type="text" name="edit_lief_name" id="f_delivery_name"                      maxlength="80"  size="20"   value=""> <img src="./images/lupe.png" border="0" alt="s" title="Suche nach Liefernamen" style="cursor:pointer;" onclick="var tmp = document.getElementById(\'f_delivery_name\'); f_buyer_id_search(tmp.value, \'delivery_name\');" /></td>
  </tr>

  <tr style="background-color:#FF5555;"> 
    <td style="white-space:nowrap;">&nbsp;{t_bill_name_2}&nbsp;</td>
    <td style="white-space:nowrap;"><input type="text" name="edit_rech_name_2" id="f_bill_name_2"  maxlength="80"  size="20"   value=""></td>
    <td style="white-space:nowrap;">&nbsp;{t_delivery_name_2}&nbsp;</td>
    <td style="white-space:nowrap;"><input type="text" name="edit_lief_name_2" id="f_delivery_name_2"                    maxlength="80"  size="20"   value=""></td>

  </tr>
  <tr style="background-color:#FF5555;"> 
    <td style="white-space:nowrap;">&nbsp;{t_bill_street}&nbsp;</td>

    <td style="white-space:nowrap;"><input type="text" name="edit_rech_strasse_1" id="f_bill_street_1"                   maxlength="80"  size="20"   value=""></td>
    <td style="white-space:nowrap;">&nbsp;{t_delivery_street}&nbsp;</td>
    <td style="white-space:nowrap;"><input type="text" name="edit_lief_strasse_1" id="f_delivery_street_1"                 maxlength="80"  size="20"   value=""></td>
  </tr>
  <tr style="background-color:#FF5555;"> 
    <td style="white-space:nowrap;">&nbsp;{t_bill_street_2}&nbsp;</td>

    <td style="white-space:nowrap;"><input type="text" name="edit_rech_strasse_2" id="f_bill_street_2"                   maxlength="80"  size="20"   value=""></td>
    <td style="white-space:nowrap;">&nbsp;{t_delivery_street_2}&nbsp;</td>

    <td style="white-space:nowrap;"><input type="text" name="edit_lief_strasse_2" id="f_delivery_street_2"                 maxlength="80"  size="20"   value=""></td>
  </tr>
  <tr style="background-color:#FF5555;"> 
    <td style="white-space:nowrap;">&nbsp;{t_bill_zip}&nbsp;</td>
    <td style="white-space:nowrap;"><input type="text" name="edit_rech_plz" id="f_bill_zip"                       maxlength="40"  size="20"   value=""></td>
    <td style="white-space:nowrap;">&nbsp;{t_delivery_zip}&nbsp;</td>

    <td style="white-space:nowrap;"><input type="text" name="edit_lief_plz" id="f_delivery_zip"                       maxlength="40"  size="20"   value=""></td>
  </tr>

  <tr style="background-color:#FF5555;"> 
    <td style="white-space:nowrap;">&nbsp;{t_bill_city}&nbsp;</td>
    <td style="white-space:nowrap;"><input type="text" name="edit_rech_ort" id="f_bill_city"                       maxlength="40"  size="20"   value=""></td>
    <td style="white-space:nowrap;">&nbsp;{t_delivery_city}&nbsp;</td>
    <td style="white-space:nowrap;"><input type="text" name="edit_lief_ort" id="f_delivery_city"                       maxlength="40"  size="20"   value=""></td>
  </tr>

  <tr style="background-color:#FF5555;"> 
    <td style="white-space:nowrap;">&nbsp;{t_bill_country}&nbsp;</td>

    <td style="white-space:nowrap;"><input type="text" name="edit_rech_land" id="f_bill_country"                      maxlength="40"  size="20"   value=""></td>
    <td style="white-space:nowrap;">&nbsp;{t_delivery_city}&nbsp;</td>
    <td style="white-space:nowrap;"><input type="text" name="edit_lief_land" id="f_delivery_country"                      maxlength="40"  size="20"   value=""></td>
  </tr>

  <tr>

	<td colspan="4" style="height:5px; background-color:#FF5555;"> </td>
  </tr>

  <tr style="background-color:#FF5555;"> 
    <td style="white-space:nowrap;">&nbsp;{t_telephone_1}&nbsp;</td>
    <td style="white-space:nowrap;"><input type="text" name="edit_telefon_1" id="f_telephone_1"                      maxlength="80"  size="20"   value="" /></td>
    <td style="white-space:nowrap;">&nbsp;{t_telephone_2}&nbsp;</td>
    <td style="white-space:nowrap;"><input type="text" name="edit_telefon_2" id="f_telephone_2"                      maxlength="80"  size="20"   value="" /></td>

  </tr>
  <tr style="background-color:#FF5555;"> 
    <td style="white-space:nowrap;">&nbsp;{t_telefax}&nbsp;</td>

    <td style="white-space:nowrap;"><input type="text" name="edit_telefax" id="f_telefax"                        maxlength="80"  size="20"   value="" /></td>
    <td style="white-space:nowrap;">&nbsp;{t_buyer_tax_id}&nbsp;</td>
    <td style="white-space:nowrap;"><input type="text" name="edit_kaeufer_ust_id" id="f_buyer_tax_id"                        maxlength="256"  size="20"   value="" id="f_buyer_tax_id" /></td>
  </tr>
</table>
</div>
</div>
</div>

Mein Javascript:


Code:
function kundendatenClicked(){
	if (document.getElementById("kundendaten_checkbox").checked == false){
		document.getElementById("kundendaten_hide").style.visibility = "hidden";
		document.getElementById("kundendaten").style.height = "50px";
	} else {
		document.getElementById("kundendaten_hide").style.visibility = "visible";
		document.getElementById("kundendaten").style.height = "350px";
	}
}

Im IE geht der Layer nicht auf 50px sondern ist von Anfang an groß. Beim klicken in die Checkbox wird der andere Layer dann auch eingeblendet und wieder ausgeblendet. Jedoch funktioniert dann auch nicht das "kleiner werden".
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 20.01.2010, 11:15
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.02.2009
Beiträge: 17
powl0r befindet sich auf einem aufstrebenden Ast
Standard

habs, durfte kein visibility nehmen sondern display im javascript
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Fußzeile unter Tabelle, bzw. Layer positionieren Dylan CSS 13 11.10.2007 16:44
zentrierte horiz. Positionierung mehrerer Layer in Zelle... kolle CSS 2 22.03.2006 15:59
Div Layer inneinander Tommyfg CSS 2 31.12.2005 09:59
Div Layer in Div Layer füllt diesen nicht aus (in FF) Daniel12 CSS 2 14.08.2005 22:05
Layer ausrichten mit float oder margin oder position:absolut heinz CSS 11 27.05.2004 02:46


Alle Zeitangaben in WEZ +2. Es ist jetzt 23:37 Uhr.