Bräuchte mal Hilfe bei meiner Header Ausblendung

Antworten
  • Seite 1 von 2
#1
28.11.2013 15:20
avatar  TripleM
#1 Bräuchte mal Hilfe bei meiner Header Ausblendung
avatar
TripleM
Mitglied

Dank des Themas

RE:Der lustige Lichtschalter

Habe ich einen Link bekommen von Frank. Nun habe ich da ein Script gefunden und es mal Umgebaut um damit den Header also das Kopfbild welches ich in der Kopfzeile habe ein und auszublenden.

Hier der Code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
 
transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Header</title>
 
<script type="text/javascript">
   function showText() {
        var spoiler = document.getElementById('spoiler');
		var button  = document.getElementById('button');
 
	    if (spoiler.style.display == 'block') {
		   spoiler.style.display='none';
		   button.value = 'Header ON';
		} else {
 
	      spoiler.style.display='block';
		  button.value = 'Header OFF';
		 }
		return false;
   }
</script>
<style type="text/css">
body {
   background-image: url(https://files.homepagemodules.de/b214495/bhnetfiles_big-e7ct-9.jpg) !important;
}
 
#spoiler {
	display: none;
}
 
p {
	font-size: 1.2em;
}
 
div {
   margin:10px 0;
}
</style>
 
</head>
<body>
<h1></h1>
<!-- BUTTON -->
<input id="button" type="button" onclick="showText();" value="On/Off" />
 
<!-- SPOLIER ANFANG -->
<div id="spoiler">
<p><br />
<center><img src='http://up.picr.de/15700985ri.jpg' border='0' /></center></p>
</div>
<!-- SPOLIER ENDE -->
 
</body>
</html>
 



Eingebaut zu Testen hier

http://ig-offroadbagaluten.xobor.de/

Nun gefällt mir da eine Kleinigkeit nicht so 100% ig.
Wenn der Header ausgeblendet ist habe ich immer noch einen Zu breiten Bereich der Sichtbar ist als Grauer Hintergrund.
Mit dem Headerbild beim Einblenden geht es gerade so. Obwohl es schöner wäre wenn ich das etwas nach oben bekommen würde.

Habe ich nun eine Möglichkeit das hin zu bekommen, beim Ausblenden des Bildes, die Kopfzeile in der Höhe schmaler zu haben und beim Einblenden des Bildes, das Bild Passgenau Zentriert in der Kopfzeile zu setzen?


Ich habe schon alles versucht was mir dazu einfällt und da ich nun nicht der HTML Experte bin Setze ich meine Hoffnung auf einen Findigen User oder Techniker im Support Forum.


 Antworten

 Beitrag melden
#2
28.11.2013 15:31
avatar  eini1971
#2 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
avatar
eini1971
Mitglied

Hi Mario,
ich verstehe nicht ganz was du möchtest bzw. ich sehe nicht daß dein Header ein- und ausgeblendet wird.

Gruß
Frank


Boardnr. 621181

www.aquariumzimmer.de
Boardnr. 572886
Business Template

 Antworten

 Beitrag melden
#3
28.11.2013 15:43
avatar  TripleM
#3 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
avatar
TripleM
Mitglied

Also in meinen Testforum

http://ig-offroadbagaluten.xobor.de/

Habe ich oben ja den Kopfbereich.



Dann habe ich einmal das Bild und einmal eben nicht. Ich hätte gerne das Bild Zentrierter



Und wenn er ausgeblendet ist dann



Hoffe nun konnte ich dir ansehnlich erklären was ich meinte.


 Antworten

 Beitrag melden
#4
28.11.2013 15:47
avatar  eini1971
#4 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
avatar
eini1971
Mitglied

Hihi,
ich war im falschen Testforum. :-)
Jetzt sehe und verstehe ich es.
Ob ich helfen kann, weiß ich noch nicht.
Ich habe versucht Text über "center" und ähnliches zu zentrieren.
Das ist mir auch noch nicht gelungen.

Ich werde es heute abend aber mal testen.

Gruß
Frank


Boardnr. 621181

www.aquariumzimmer.de
Boardnr. 572886
Business Template

 Antworten

 Beitrag melden
#5
28.11.2013 17:31
avatar  Olaf
#5 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
Ol
Olaf
Mitglied

Ich würde den Button über den Header legen,damit Dein Banner nicht vom Botton beeinflußt wird:

1
2
3
4
5
 
#button {
     position: absolute;
     width:78px;
     z-index: 200;
}
 


Das "width:78px" verkürzt Dein Button,damit er nicht auf den Banner zu "liegen" kommt.

Damit Dein Bannerabstand oben und unten gleich ist,kannst Du dieses z.B. noch einsetzen:

1
2
3
 
#spoiler img {
     margin-top: -8px ! important;
}
 



Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
#6
28.11.2013 18:59 (zuletzt bearbeitet: 28.11.2013 19:02)
avatar  TripleM
#6 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
avatar
TripleM
Mitglied

@Olaf Danke Olaf, das schon mal die Zentrierung. Wusste erst nicht so gnau wohin die nun muß aber es wird mir immer verständlicher mit den Ganzen Anweisungen.
Gibt es nun noch die Möglichkeit irgendwie die Header Höhe zu begrenzen wenn der Heaer (Das Bild) ausgeblendet ist?

Problem ist das ich ja nicht den .header ausblenden kann weil er dann ja generell fehlt.


 Antworten

 Beitrag melden
#7
28.11.2013 19:17
avatar  TripleM
#7 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
avatar
TripleM
Mitglied

Wurde nun aber etwas eingebremst. Weil es eben immer beim Aktualisieren in den Off Modus geht. Sprich ich müsste jedes mal den Schalter erneut Drücken um den Header einzuschalten.
Meine Überlegung war eben das es wie ein Script on Off geht und selbst bei Neuladen der Seite so bleibt. Das scheint dann eher nicht zu Funktionieren. Oder mir ist nun nicht bewusst ob man es Realisieren kann.


 Antworten

 Beitrag melden
#8
28.11.2013 19:42
avatar  eini1971
#8 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
avatar
eini1971
Mitglied

Hi Mario,
alle Variablen werden mit dem Laden der Seite gesetzt.
Egal welcher Zustand dir angezeigt wird,
so werden die Variablen beim Aktualisieren der Seite wieder zurück gesetzt.
Der Code wir ja zusammen mit deinen Seiten geladen weil er im Kopfbereich oder der Fußzeile steht.

Mir fehlen auch die Kenntnisse um Variablen separat zu speichern.
Hab mich mal mit dem Prinzip von Cookies beschäftigt.
Aber entweder habe ich es nicht gerafft oder die Beschreibungen waren einfach zu komplex um einfache Tests zum Lernen zu erstellen.
Das wäre aber der einzige Weg der mir jetzt dazu einfällt,
da die Variaben auf deiner Platte abgelegt werden und manipuliert werden können.

Gruß
Frank


Boardnr. 621181

www.aquariumzimmer.de
Boardnr. 572886
Business Template

 Antworten

 Beitrag melden
#9
28.11.2013 19:45 (zuletzt bearbeitet: 28.11.2013 19:46)
avatar  TripleM
#9 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
avatar
TripleM
Mitglied

Es schwirt mir der Befehl onclick vor Augen. Da ich mich aber auf Absolutes neuland bewege weiß ich aktuell noch nicht ob mich das weiter Hilft.


 Antworten

 Beitrag melden
#10
28.11.2013 19:59
avatar  eini1971
#10 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
avatar
eini1971
Mitglied

"onclick" steckt ja schon im Code drin.
Damit wird die Grafik gesetzt und die Toggle-Funktion aufgerufen.
Aber der Zustand "an" oder "aus" wird nicht so abgelegt, daß er bei Aktualisierung beibehalten wird.

Gruß
Frank


Boardnr. 621181

www.aquariumzimmer.de
Boardnr. 572886
Business Template

 Antworten

 Beitrag melden
#11
28.11.2013 20:11
avatar  TripleM
#11 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
avatar
TripleM
Mitglied

Hmm stimmt da hast du Recht. Ich sehe langsam nicht mehr durch. Bin Zeitgleich in 3 Foren am Testen und nebenbei den Editor von WIN.Ich glaube ich sollte nicht alles auf einmal machen.
Na mal sehen ob noch irgendwer eine Lösung hat.


 Antworten

 Beitrag melden
#12
28.11.2013 23:37
avatar  Olaf
#12 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
Ol
Olaf
Mitglied

Die Idee mit den Cookies kann man mit ein wenig Änderung im Script realisieren.
Hier das Script mit der angepassten CSS.Das Script muss unter dem HTML Code!

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
 
<style type="text/css">
body {
background-image: url(https://files.homepagemodules.de/b214495/bhnetfiles_big-e7ct-9.jpg) !important;
}
 
p {
font-size: 1.2em;
}
 
div {
margin:10px 0;
}
 
#button {
position: absolute;
width:78px;
z-index: 200;
}
 
</style>
 
<input id="button" type="button" value="On/Off" onclick="showText();">
<div id="spoiler">
<p>
<center>
<img border="0" src="http://up.picr.de/15700985ri.jpg" style="max-width: 1181px;">
</center>
</p>
</div>
 
<script type="text/javascript">
var BannerAnAus = "BannerAnAus";
var xcookie = document.cookie;
var spoiler = document.getElementById('spoiler');
var button = document.getElementById('button');
var abfrage = xcookie.indexOf(BannerAnAus)+ BannerAnAus.length + 1;
var schalter = xcookie.substring(abfrage);
if (schalter == 0) {
spoiler.style.display='none';
button.value = 'Header ON';
} else {
spoiler.style.display='block';
button.value = 'Header OFF';
}
function showText() {
var spoiler = document.getElementById('spoiler');
var button = document.getElementById('button');
if (spoiler.style.display == 'block') {
spoiler.style.display='none';
button.value = 'Header ON';
document.cookie = 'BannerAnAus=0;';
} else {
spoiler.style.display='block';
button.value = 'Header OFF';
document.cookie = 'BannerAnAus=1;';
}
}
</script> 
 



Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
#13
28.11.2013 23:43
avatar  TripleM
#13 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
avatar
TripleM
Mitglied

@Olaf Danke Olaf genau so habe ich mir das gedacht nun werde ich mir das um es besser zu verstehen genauer im Editor anschauen und die von dir geänderten Bereiche er Googeln um zu Verstehen wieso was wie Funktioniert. Tausend Dank für deine Hilfe.


 Antworten

 Beitrag melden
#14
29.11.2013 00:03
avatar  Olaf
#14 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
Ol
Olaf
Mitglied

Gern geschehen.
Das Prinzip ist ganz einfach.
Ich habe ein Cookie mit den Namen "BannerAnAus" angelegt.
Mit den Schalter (Button) "ON/Off" wird dem Cookie ein Wert von "0" oder "1" zugewiesen,der bei jeden aktualisieren der Seite abgefragt wird und so den letzten Zustand vom Banner immer wieder setzt.

Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
#15
29.11.2013 00:09
avatar  TripleM
#15 RE: Bräuchte mal Hilfe bei meiner Header Ausblendung
avatar
TripleM
Mitglied

Ich bin so Happy, denn das war einer der Größten wünsche einiger User. Die fühlen sich vom Header in meinen Jeep Forum erdrückt. Und somit können sie den ein und aus schalten. Klasse nochmal Merci.


 Antworten

 Beitrag melden
Antworten
Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!