Autor |
Nachricht |
-
1zu5racing
|
21.12.2012 um 08:46 (UTC) Titel: Zufallsheader |
|
|
ich würde gerne in dem neuen Design 3 Zufallsheaderbilder einbringen.
Den Code dazu habe ich, allerdings schaffe ich es nicht, die Bilder so zu positionieren, wie das Orignalheaderbild.
Je nach Browserfenstergröße wandert das Ganze ja.
Habe schon ausgiebig die Forensuche bemüht, aber nichts gefunden.
Bitte um Hilfe! Danke!
Zuletzt bearbeitet von 1zu5racing am 21.12.2012, 11:22, insgesamt einmal bearbeitet
|
|
↑
|
|
|
-
internet-macht-weihnachten
|
21.12.2012 um 08:51 (UTC) Titel: Re: eigene Headerbilder positionieren |
|
|
1zu5racing hat Folgendes geschrieben: ich würde gerne in dem neuen Design 3 Zufallsheaderbilder einbringen.
Den Code dazu habe ich, allerdings schaffe ich es nicht, die Bilder so zu positionieren, wie das Orignalheaderbild.
Je nach Browserfenstergröße wandert das Ganze ja.
Habe schon ausgiebig die Forensuche bemüht, aber nichts gefunden.
Bitte um Hilfe! Danke!
Also das mit den 3 Header wird nicht klappen weil die sich ja überlaggen wird. Also such dir lieber ein Header aus den du nehmen möchtest und schon ist das Problem gelöst. Oder was du auch machen kannst wenn du die verschiedenen Header in ein Bearbeitungsprogramm machst und das du die zusammen schneidest so das daraus ein Bild wird. Z.b mit einer Collage. |
|
↑
|
|
|
-
1zu5racing
|
|
↑
|
|
|
-
internet-macht-weihnachten
|
21.12.2012 um 09:16 (UTC) Titel: |
|
|
1zu5racing hat Folgendes geschrieben:
Achso, da kann ich dir leider auch nicht weiter hellfen, sorry |
|
↑
|
|
|
|
21.12.2012 um 09:36 (UTC) Titel: |
|
|
Hallo,
zu dem, was man in dem anderen Thread findet sage ich jetzt mal nichts. Ich tippe es dir mal vernünftig und gleichzeitig wesentlich einfacher hin. Tippfehler sind daher vorbehalten. Einfach bei "Text unter dem Design" einfügen:
Zitat: <script type="text/javascript">
var headers = new Array();
headers.push('URL Header 1');
headers.push('URL Header 2');
headers.push('URL Header 3');
document.getElementById('header-image').style.backgroundImage = 'url(' + headers[Math.floor(Math.random() * headers.length)] + ')';
</script>
Das rote für jedes weitere Bild kopieren. Hier wird also aus 3 Bildern gewählt. ______________ mfg
o-4-n
"If you’re incompetent, you can’t know you’re incompetent." - [David Dunning]
*** Die Suchfunktion ist KEINE tödliche Krankheit! ***
Eventplanung, Equipment, Zeltverleih, Catering
Zuletzt bearbeitet von o-4-n am 30.01.2013, 20:11, insgesamt einmal bearbeitet
|
|
↑
|
|
|
-
1zu5racing
|
21.12.2012 um 10:09 (UTC) Titel: |
|
|
funktioniert, DANKE!!!! |
|
↑
|
|
|
-
webseitenfreund
|
30.01.2013 um 18:36 (UTC) Titel: |
|
|
Hallo
Ich würde mir gerne auch solch einen Zufalls Header einbauen, habe es auch schon mit dem oben genannten Code ausprobiert, leider aber geht dies in meinem Design nicht - mein Design ist das CSS-Design ( http://www.homepage-baukasten.de/forum/viewtopic.php?t=134832 ) - Es wäre sehr freundlich, wenn mir jemand eine Hilfe geben könnte, wie ich dies machen könnte.
Im voraus bedanke ich mich für jede Antwort und Hilfen!
Liebe Grüße
Zuletzt bearbeitet von webseitenfreund am 30.01.2013, 19:38, insgesamt 3-mal bearbeitet
|
|
↑
|
|
|
|
|
↑
|
|
|
-
webseitenfreund
|
30.01.2013 um 20:24 (UTC) Titel: |
|
|
Vielen Dank für Ihre Antwort, nur wo sollte ich dieses einfügen oder ersetzen, ich habe dies erst in: " CSS-Code ohne Style Tags" und dann, wie oben beschrieben, in: "Text unter dem Design" eingefügt bzw habe etwas verändert damit es geht, aber es geht alles nicht. Könnten Sie mir evtl schreiben, wie ich es machen muss, um in diesem Design ein Zufalls Header zu bekommen - Vielen Dank!
Zuletzt bearbeitet von webseitenfreund am 30.01.2013, 21:26, insgesamt einmal bearbeitet
|
|
↑
|
|
|
|
30.01.2013 um 21:57 (UTC) Titel: |
|
|
Mal eine doofe Frage, warum fügst du es zuerst woanders ein, wenn du doch gelesen hast, wo es hin soll?
Das was ich grün markiert habe, musst du einfach nur mit der Id deines Headers ersetzen. Wolle hat da so schöne Screenshots gemacht und die auch noch beschriftet, das bekommst du selbst hin. Die Id ist jeweils der Text, der neben der # steht.
EDIT: Da wir hier im Baukasten sind, betone ich es besser mal ausdrücklich: Die # NICHT einfügen!!! ______________ mfg
o-4-n
"If you’re incompetent, you can’t know you’re incompetent." - [David Dunning]
*** Die Suchfunktion ist KEINE tödliche Krankheit! ***
Eventplanung, Equipment, Zeltverleih, Catering
Zuletzt bearbeitet von o-4-n am 30.01.2013, 23:02, insgesamt 2-mal bearbeitet
|
|
↑
|
|
|
-
webseitenfreund
|
31.01.2013 um 18:56 (UTC) Titel: |
|
|
Hallo,
ich habe jetzt alles versucht, aber es funktioniert alles nicht, ich habe dieses Design und wo bitte füge ich jetzt das, was Sie grün Markiert haben, ein?. Ich habe auch schon ohne dieses Zeichen "#" eingefügt, trotzdem geht es nicht.
Ich habe dieses Design:
Code: /* Nullformatierung für alle Browser */
*{padding: 0px; margin: 0px; }
/* Werbung mittig */
table[height="102"] { margin: auto; }
/* Hintergrund hinter Design */
body {
background-color: #eeeeee;
background-image: url();
font-family: arial;
font-size: 14px;
color: #000000; }
/* Design-Container */
#container {
width: 962px;
margin: 10px auto;
overflow: hidden; }
/* Headerfeld 960 x 120 */
#header_container {
width: 960px;
height: 120px;
margin-bottom: 10px;
background-color: #FFFFFF;
background-image: url();
border: 1px solid #c9c9c9; }
/* Titel im Headerfeld entfernt */
h1#header {display: none; }
/* Feld der Navigation */
#nav_container {
width: 960px;
height: 40px;
margin-bottom: 10px;
background-color: #FFFFFF;
background-image: url();
border: 1px solid #c9c9c9; }
/* Titel über Navigation entfernt */
#nav_heading {display: none; }
/* Aufzählungspunkte in Navi entfernt */
ul#nav {
list-style-type: none; }
/* Navi-Buttons */
li.nav_element {
width: 120px;
height: 40px;
float: left;
text-align: center;
border-right: 1px solid #c9c9c9;
background-color: #FFFFFF;
background-image: url(); }
/* Hover Navi-Button */
li.nav_element:hover { background-color: #202020; }
/* Linktexte in Navigation */
li.nav_element a {
display: block;
font-size: 15px;
color: #000000;
line-height: 40px;
text-decoration: none; }
/* Hover Linktexte Navigation */
li.nav_element a:hover { color: #FFFFFF; }
/* Seiteninhalt */
#content {
float: left;
width: 665px;
min-height: 200px;
padding: 20px 20px 20px 20px;
background-color: #FFFFFF;
background-image: url();
border: 1px solid #c9c9c9;
overflow: hidden; }
/* Titel Seiteninhalt + Titel über Box */
h2#title , #sidebar_heading {
padding: 5px 0px 5px 20px;
margin: -20px -20px 15px -20px;
background-color: #dddddd;
color: #000000;
font-size: 14px;
font-weight: normal; }
/* Link im Seiteninhalt */
#content a {color: #000080; }
/* Hover Link im Seiteninhalt */
#content a:hover {color: #008080; }
/* Rechte Box */
#sidebar_container {
float: right;
width: 200px;
min-height: 200px;
padding: 20px 20px 20px 20px;
background-color: #FFFFFF;
background-image: url();
border: 1px solid #c9c9c9;
overflow: hidden; }
/* Liste in rechter Box */
#sidebar_content ul {
list-style-type: square;
margin: 15px 0px 15px 25px; }
/* Linktexte in Box */
#sidebar_content ul li a {
color: #000000;
font-size: 14px;
text-decoration: none; }
/* Hover Linktexte Box */
#sidebar_content ul li a:hover { color: chocolate; }
/* Feld unter dem Design */
#footer {
width: 920px;
padding: 20px 20px 20px 20px;
margin: auto;
background-color: #FFFFFF;
background-image: url();
border: 1px solid #c9c9c9; }
/* unnötige Felder im Design entfernt */
#pre_header {display:none;}
#post_header {display:none;}
#post_content {display:none;}
#below_content{display:none;}
#counter{display:none;}
...und habe das so eingefügt:
/* Headerfeld 960 x 120 */
'header-image'
und dieses habe ich oben dann ersetzt: #header_container {
width: 960px;
height: 120px;
margin-bottom: 10px;
background-color: #FFFFFF;
background-image: url();
border: 1px solid #c9c9c9; }[/color]
Entschuldigung, weil ich danach nochmals gefragt hatte, aber man Lernt es einmal, und weiß wie es am ende gemacht wird. Im voraus nochmals vielen Dank, für die Hilfen!.
PS.: Es gibt von @Wolle Screenshots, aber für das oben genannte Profi- Design aber nicht - oder?... ich habe mich jetzt mehrmals im Forum gesucht, habe aber leider nichts gefunden zu diesem Design.
Liebe Grüße, Pa. Schmidt
Zuletzt bearbeitet von webseitenfreund am 31.01.2013, 19:59, insgesamt einmal bearbeitet
|
|
↑
|
|
|
-
seo-suchmaschinenoptimierung
Wohnort: Planet SEO
|
31.01.2013 um 19:24 (UTC) Titel: |
|
|
Scheinbar ist es für manche nicht ganz so einfach zu lesen und / oder zu verstehen. Okay, nochmal von vorne.
Damit bei jedem Seitenaufruf ein neues Headerbild erscheint, muss im Login-Bereich unter " Design einstellen", " Erweiterte Einstellungen" folgender Code bei " Text unter dem Design" eingetragen werden.
<script type="text/javascript">
var headers = new Array();
headers.push('http://img.webme.com/pic/s/seo-suchmaschinenoptimierung/seo-such.jpg');
headers.push('http://img.webme.com/pic/s/seo-suchmaschinenoptimierung/seo-such2.jpg');
headers.push('http://img.webme.com/pic/s/seo-suchmaschinenoptimierung/seo-such3.jpg');
document.getElementById(' header-image').style.backgroundImage = 'url(' + headers[Math.floor(Math.random() * headers.length)] + ')';
</script>
Es können beliebig viele Bilder eingetragen werden, einfach dazu
headers.push('http://img.webme.com/pic/s/seo-suchmaschinenoptimierung/seo-such3.jpg');
entsprechend oft wiederholen, wie Bilder vorhanden sind und natürlich http://img.webme.com/pic/s/seo-suchmaschinenoptimierung/seo-such.jpg entsprechend gegen die eigenen Bild-URLs tauschen.
Da bei dir das Element des Headerbildes nicht header-image genannt wird, sondern header_container sollte eigentlich entsprechend klar sein, dass header_container dort stehen muss.
Und schon klappt auch das wechselnde Headerbild.
PS: Ist übrigens genau das, was o-4-n schon die ganze Zeit versucht zu predigen und was auch wunderbar funktioniert. ( siehe meinen Header auf meiner Seite ) ______________ mfg SEO |
|
↑
|
|
|
-
webseitenfreund
|
31.01.2013 um 19:50 (UTC) Titel: |
|
|
Ein rieses großes Dankeschön an: http://www.seo-suchmaschinenoptimierung.de.tl/ und http://www.-4-n.de.tl
es funktioniert, ich freue mich riesig !. So habe ich es zwar auch mehrmals gemacht, der Code bei "Text unter dem Design" eingefügt, aber ginge nicht, jetzt weiß man auch warum, das "header-image" war dran schuld - nochmals vielen vielen Dank an euch beiden!!
liebe Grüße, Pa. Schmidt |
|
↑
|
|
|
|