Autor |
Nachricht |
-
gygrusher
|
22.09.2011 um 19:14 (UTC) Titel: [erledigt] Korrigieren meines Design-Codes |
|
|
Hallo liebe HPBKler,
Ich suche jemanden, der meinen Designcode so abändert, dass sich auch bei der Änderung der Größe des Browserfensters die Texte etc. an der richtigen Stelle bleiben und sich auch die Hintergrund-Grafik nicht verdoppelt o.ä.
Mein Code:
Text über dem Design: Zitat: <div id="videotext"> <span style="color: rgb(255, 255, 255); ">Die Videos stammen von meinen beiden YouTube-Accounts: </span><br><a href="http://www.youtube.com/user/GYGRusher"><span style="color: rgb(255, 255, 255); ">GYG Rusher</span></a><span style="color: rgb(255, 255, 255); "> und </span><a href="http://www.youtube.com/user/Teamcharger"><span style="color: rgb(255, 255, 255); ">Teamcharger<br />
</span></a><span style="color: rgb(255, 255, 255); ">Die Videos wurden von mir selbst erstellt. </span><br /></div>
<div id="videobox"> <iframe id="videoelement" width="430" height="260" src="http://www.youtube.com/embed/2oKSIs6jTrE" frameborder="0" allowfullscreen></iframe></div>
<div id="extraDiv4"><script type="text/javascript">
function changeVideo(url)
{
document.getElementById('videoelement').src = url;
}
</script><a href="#" onclick="changeVideo('http://www.youtube.com/embed/viefNFJRPXY'); return false;"><img width="180" height="120" alt="" src="http://i3.ytimg.com/vi/viefNFJRPXY/default.jpg" /></a>
<br>
<a href="#" onclick="changeVideo('http://www.youtube.com/embed/2oKSIs6jTrE'); return false;"><img width="180" height="120" alt="" src="http://i3.ytimg.com/vi/2oKSIs6jTrE/default.jpg" />
</a>
<div id="extraDiv5"><span style="font-size: x-large; "><span style="color: rgb(255, 255, 255); ">Sprachen/ Languages:<br />
<hr>
</span><img width="220" height="47" alt="" src="http://www.bilderhoster24.de/images/qd0xhoom82add54sv4ku.jpg" /><br />
<hr>
<a href="http://rusher-en.de.tl/"><img width="220" height="53" alt="" src="http://www.bilderhoster24.de/images/0nfldjnmsoaiiuoklloh.jpg" /></a><br type="_moz" />
</div>
<div id="ytlink"><a href="http://www.youtube.com/user/GYGRusher"><img width="200" height="80" alt="" src="http://home.nauthic-records.de/youtube-logo.jpg" /></a></div>
<div id="m95lehnt"><br />
<span style="font-size: x-large; "><font class="Apple-style-span" color="#ffffff"><img width="600" height="600" alt="" src="http://img.webme.com/pic/g/gygrusher/m95.png" /><br />
</font></span> </div>
<div id="knife"><img width="90" height="23" alt="" src="http://img.webme.com/pic/g/gygrusher/knife.png" /></div>
<div id="schild"> <img width="490" height="280" alt="" src="http://img.webme.com/pic/g/gygrusher/kzgfh.png" /></div>
<div id="partner"><span style="color: rgb(255, 255, 255); "><span style="font-size: x-large; "><a href="http://gygrusher.de.tl/partner.htm">Partner</a></span></span><br /><br>
<a href="http://hp-werbungen.de.tl/"><img width="200" height="24" alt="" src="http://img.webme.com/pic/h/hp-werbungen/b55.png" /></a><br type="_moz" />
</span></span><br /></div>
CSS ohne Style Tags: Zitat: h1#title{display: none;}
h2#title span {display: none;}
div.header{display: none;}
#sidebar_container{display:none;}
#counter{display:none;}
body {
background-color: #FFFFFF;
background-image: url(http://www.bilderhoster24.de/images/1zq0ebrc1xxibay38tqv.jpg); }
#content {
position: absolute;
left: 50%;
top: 420px;
margin-left: -320px; width: 420px; }
#nav_container { position: absolute; left: 50%; top: -65px; margin-left: -578px; width: 900px; height: 17px; text-align: left; border-top: 0px solid #ffffff; background-image:url(); } li.nav_element { display: inline-block; text-align: center; height:9px; padding: 13px; width: 94px; background-image:url(http://img.webme.com/pic/g/gygrusher/navinavinewgaming.png); border-left: 1px solid #3f3f3f; border-right: 1px solid #3f3f3f; } li.nav_element a { font-size:15px; color: #e5fcff; font-family: Tahoma; text-decoration: none; }
li.nav_element:hover { height :9px; background-image:url(http://img.webme.com/pic/o/omba-test/navinavinewgaminghover.png); }
li.nav_element:hover a { font-size:15px; color: #fff; font-family: Tahoma; text-decoration: none; }
#videotext {position: absolute;
left: 50%;
top: 565px;
margin-left: -310px; width: 960px;
height: 100px; color: #FFFFFF;
font-size: 14px;
font-family: arial;. }
#videobox {position: absolute;
left: 50%;
top: 275px;
margin-left: -313px; }
#extraDiv4 {position: absolute;
left: 50%;
top: 280px;
margin-left: 133px; }
#extraDiv5 {position: absolute;
left: -380%;
top: -50px;
margin-left: 3px; border:2px solid #FFFFFF; }
#ytlink {position: absolute;
left: -242%;
top: 420px;
margin-left: 3px; }
#m95lehnt {position: absolute;
left: -480%;
top: 670px;
margin-left: 3px; }
#knife {position: absolute;
left: 50%;
top: -120px;
margin-left: -385px; }
#schild {position: absolute;
left: 50%;
top: -190px;
margin-left: 45px; }
#partner {position: absolute;
left: -242%;
top: 520px;
margin-left: 3px; }
Danke im Voraus& MFG Jamie
Zuletzt bearbeitet von gygrusher am 25.09.2011, 18:08, insgesamt 8-mal bearbeitet
|
|
↑
|
|
|
-
gygrusher
|
24.09.2011 um 08:47 (UTC) Titel: |
|
|
*Push* |
|
↑
|
|
|
|
|
↑
|
|
|
-
gygrusher
|
24.09.2011 um 17:12 (UTC) Titel: |
|
|
Hmmm.
Nun hatte ich aber die Idee, dass es ja sein könnte, dass man einfach den Code für den Hintergrund so abändern könnte, dass sich die Hintergrundgrafik beim verkleinern/vergrößern des Browserfensters ebenfalls verkleinert/vergrößert.
ginge das und wenn ja, wie?
MFG Jamie |
|
↑
|
|
|
-
4i
|
24.09.2011 um 18:15 (UTC) Titel: |
|
|
Hey,
wie wärs wenn du mal etwas mit Designvorlagen rumexperemntierst? Hier im Forum findet man welche, bei denen die Klassen "richtig" postioniert sind. Die meisten arbeiten mit den Befehlen float: left;, float: center; und/oder float: right; um das Design richtig zu positionieren. Alternativ kannst du dir auch die Codes fertiger Designs anschauen.
Schau dir mal folgende Grundgerüste an:
http://www.homepage-baukasten.de/forum/viewtopic.php?p=668740#668740
Es sind zwar nur Standartklassen, aber wenn du es verstanden hast, läuft das mit den erstellten Divs genau so ab.
Auserdem könnte dir die folgende Seite bei den Positionierungen helfen:
http://de.selfhtml.org/css/eigenschaften/positionierung.htm
Liebe Grüße, David |
|
↑
|
|
|
-
gygrusher
|
25.09.2011 um 17:07 (UTC) Titel: |
|
|
Hab schon angefangen. Ist fast fertig: gygrusher.de.tl
Danke an alle& MFG Jamie
P.s. @Mod: Pls close |
|
↑
|
|
|
|
25.09.2011 um 17:13 (UTC) Titel: |
|
|
Zitat: P.s. @Mod: Pls close
Hallo!
Vielen Dank für deine Rückmeldung!
Freut mich, dass es anscheinend geklappt hat!
Dein Wunsch sei mir Befehl! ^^
Lg, Loisi ______________ Leben heißt nicht zu warten, bis der Sturm vorüberzieht, sondern zu lernen, im Regen zu tanzen! |
|
↑
|
|
|
|