zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Div Layer einblenden

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 15.03.2010, 17:42
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.03.2010
Beiträge: 1
allmighty.whity befindet sich auf einem aufstrebenden Ast
Standard Div Layer einblenden

Hallo,

Hallo,

hinter dem etwas komplizierten Titel verbirgt sich etwas, dass denke ich alle kennen:

Ich will einen Div Layer einblenden ohne, dass sich der Dokumentinhalt verschiebt.

Auf der Seite befindet sich eine Suchfunktion und ein Button für die erweiterte Suche. Klickt man auf diesen Button soll ein Div Layer eingeblendet werden, indem die zusätzlichen Suchoptionen angezeigt werden. Dieser Layer soll den Hintergrund dann quasi überdecken.
Im Moment wird der Layer aber einfach nur eingefügt und der restliche Dokumentinhalt nach unten verschoben. Das soll allerdings unterbunden werden, der Inhalt soll da bleiben wo er ist.

So wie wenn ich hier in der Menüleiste auf "Community" klicke und sich dann sanft der Layer Community Links etc. einblendet. Ich hab den code da auch schon durchforstet, allerdings fällt es mir schwer, da das wesentliche rauszukriegen.

Code Fragmente:
Code:
envi.css
#search {
	float:right;
	font-family: Arial, Helvetica, sans-serif; 
	font-size: 12px;
	width:auto;
	height:auto;
	z-index:1;
}

#advancedSearch {
	position:relative;
	z-index:-1;
	display:none;
	float:right;
	font-family: Arial, Helvetica, sans-serif; 
	font-size: 12px;
	width:auto;
	height:auto;
	background-color:#fff;
	padding:10px;
	margin:5px;
	line-height:3;
}
und hier der HTML Ausschnitt
HTML-Code:
<div id="search">
	<form action="scidoc.php" method="get" name="searchForm">
		<label class="text">Search <input type="text" name="search"/></label>
	<input type="button" value="Advanced Search" onclick="showAdvanced('advancedSearch')" />
<div id="advancedSearch">
<?php
	echo '<label class="text"> from <select name="begin">';
	$thisYear=getdate();
	echo $thisYear["year"];
	for ($x=1999; $x<= $thisYear["year"];$x++){
		echo '<option value='.$x.'>'.$x.'</option>';
	}
	echo '</select></label>
		<label class="text"> to <select name="end">';
	for ($x=1999; $x<= $thisYear["year"];$x++){
			if ($x==$thisYear["year"]) {
			echo '<option selected="yes">'.$x.'</option>';
			break;
		}
		echo '<option value='.$x.'>'.$x.'</option>';
	}
	echo '</select></label><br/>';
	?>
<label class="text"> Document type
<select name="document">
<option value="all" selected="yes">all</option>
<option value="paper">paper</option>
<option value="extern">extern</option>
<option value="research">research doc</option>
</select>
</label>
<br/>
	<input type="submit" value="search">
	<input type="reset" value="reset">
  </form>
  </div>
</div>
der Php Text stimmt soweit, ich hab ihn nur eingefügt, falls php irgendwas schlimmes mit HTML machen sollte.

Also wenn mir jemand sagen kann warum der Layer mit der Id "AdvancedSearch" immer alles nach unten verschiebt oder besser wie man es vermeidet wäre ich euch sehr dankbar.

Liebe Grüße
Whity
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 15.03.2010, 21:29
Neuer Benutzer
neuer user
 
Registriert seit: 14.03.2010
Beiträge: 6
sun_sam befindet sich auf einem aufstrebenden Ast
Standard

Moin,

ich schätze, es liegt daran, dass #advancedsearch relativ positioniert ist, bzw. wie die Elemente, die darauf folgen positioniert sind (clearer dazwischen?), bzw. wie der Layer positioniert ist, in dem die beiden Such-Container sind.

Mit clearer meine ich einen Dummy-Layer, der nach den Floats "aufräumt"...

Du kannst mal ausprobieren, ob Du die Floats raus lässt und stattdessen absolut positionierst, bzw. den Layer, in dem die Floats sind absolut positionierst, und die darauf folgenden auch. Vielleicht würde es auch reichen den #advancedsearch absolut zu positionieren (kein float). Ob das funktioniert kann ich Dir aber nicht garantieren, dafür steht hier zu wenig Code.

Noch eine kleine Anmerkung, die eigentlich nichts zur Sache beisteuert: Die Seite wird nicht valide sein (falls sie es sein soll).

Grüße
Mit Zitat antworten
Sponsored Links
Antwort

Stichwörter
css layer einblenden

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
Fragen zu CSS und Joomla DOKTOR CSS 2 23.05.2011 20:29
Brauche Hilfe: Schwarzes Nichts Zwox CSS 10 19.11.2010 17:53
Header entfernen tripple CSS 17 15.06.2010 16:41
Schriftfarbe in den Eintragungsfeldern von jforms Steveislucky CSS 2 16.03.2010 11:59
CSS Text nebeinander? carstiee09 CSS 13 13.11.2009 20:18


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:20 Uhr.