Ergebnis 1 bis 8 von 8
  1. #1
    SurviveX SurviveX ist offline
    Avatar von SurviveX

    Probleme mit HTML und CSS!

    Also, ich hab mal ne Homepage gemacht, ist für die Schulbenotung in WebDesign und nun muss ich den INhalt reinfügen und alles ausbessern.
    Und mir stellen sich ziemlich viele Probleme in den Weg.

    So sieht es bis jetzt aus

    PHP-Code:
    <html>
    <
    head>

    <
    BODY LINK="#00FF00" TEXT="#FF0000" VLINK="#FF0000" ALINK="#00FF00" BGCOLOR="#000000"></body>
    <
    style type="text/css">
    #fi {
      
    positionabsolute;
      
    top510px;
      
    left425px;
    }
    #it1 {
      
    positionabsolute;
      
    top200px;
      
    left425px;
    }
    #it2 {
      
    positionabsolute;
      
    top200px;
      
    left10px;
    }


    #img.1 {
    width200px;
    height150px;
    }

    #img.1 hover {
    widthauto;
    heightauto;
    }

    #img.1 {
    positionabsolute;
    top300px;
    left700px;
    }


    /* Navigation */
    .navigation a:hover {background-positionleft bottomcolor#456;}
    .navigation {
    height41px;
    border-left1px solid #B5D99D;
    border-right100px solid #B5D99D;
    border-bottom100px solid #D9E1E5;
    background-color#0000FF;
    background-imageurl(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);
    }
    .
    navigation a {
    displayblock;
    floatleft;
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);
    border-left1px solid #DBEACD;
    color#253 !important;
    line-height1px;
    text-decorationnone !important
    font-weightbold
    font-size1.1em
    font-familysans-serif
    padding0 20px;
    }
    .
    navigation ul {list-stylenonefloatleft;}
    .
    navigation ul li {floatleftdisplayblockposition:relative;}
    .
    navigation ul li ul {position:absolutedisplay:nonetop:100%; left:-19px;}
    .
    navigation ul li ul a {line-height:20pxheight:20pxwidth:100px
    border-right1px solid #DBEACD; font-size:1em;
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);}
    .navigation ul li:hover ul {display:block;}
    .
    navigation ul li:before {content:no-open-quote !important;}
    .
    navigation ul li {text-indent0emmargin-left0em;}
    </
    style>
    <
    title>Startseite</title>
    </
    head>
    <
    body>
    <
    style type="text/css">
    /* Navigation */
    .navigation a:hover {background-positionleft bottomcolor#234;}
    .navigation {   
    height1px;
    border-left1px solid #B5D99D; 
    border-right100px solid #B5D99D; 
    border-bottom1px solid #D9E1E5; 
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg); 
    }
    .
    navigation a {
    displayblock;
    floatleft;
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);
    border-left1px solid #DBEACD;
    color#456 !important;
    line-height41px;
    text-decorationnone !important
    font-weightbold
    font-size1.1em
    font-familysans-serif
    padding0 20px;
    }
    .
    navigation ul {list-stylenonefloatleft;}
    .
    navigation ul li {floatleftdisplayblockposition:relative;}
    .
    navigation ul li ul {position:absolutedisplay:nonetop:100%; left:-19px;}
    .
    navigation ul li ul a {line-height:20pxheight:20pxwidth:100px
    border-right1px solid #DBEACD; font-size:1em;
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);}
    .navigation ul li:hover ul {display:block;}
    .
    navigation ul li:before {content:no-open-quote !important;}
    .
    navigation ul li {text-indent0emmargin-left0em;}
    </
    style>
    <!
    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>
    <
    title>Startseite </title>
    <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <
    style type="text/css" media="all"
       </
    style>
    <
    meta name="robots" content="index,follow" />
    <
    meta http-equiv="Content-Language" content="de" />
    <!--[if 
    IE]><style type="text/css" media="all"> @import url(); </style><![endif]--><body class="body" id="seite_20">
    <
    div id="top">
    <
    div id="pfad"><strong><a href="http://schulefeld.ch">Schule Feld</a></strong> &gt; <a href="http://schulefeld.ch/wf/Andrea">Andrea</a> &gtStartseite</div>
    <
    div id="suche">
      
    </
    div>
    </
    div>
    <
    div id="rahmen">
    <
    h1>Startseite</h1>
    <
    div id="rahmen">
    <
    table CELLSPACING="4" CELLPADDING="6" ALIGN="Center" border="5" width="96">
    <
    tr>
    <
    td align="center" bgcolor="#FFFFFF" width="53"><a href="#"
    onmouseover="document.bgColor='#6699FF'"><font color="#6699FF">Hellblau</font></td>
    <
    td align="center" bgcolor="#FFFAEA" width="53"></a><a href="#"
    onmouseover="document.bgColor='#fffaea'"><font color="#FFFAEA">Weiss</font></td>
    <
    td align="center" bgcolor="#CCCCCC" width="54"></a><a href="#"
    onmouseover="document.bgColor='#cccccc'"><font color="#CCCCCC">Silber</font></td>
    </
    a><td align="center" bgcolor="#000000" width="54"><font color="#000000"><a href="#"
    onmouseover="document.bgColor='#000000'">Schwarz</a></font></td>
    </
    tr>
    </
    table>





    </
    div>
    <
    div class="navigation">
    <
    a href="../HTML/Index.html">Home</a>
    <
    a href="../HTML/Ich.html">Über mich</a>
    <
    a href="../HTML/Sport.html">Sport</a>
    <
    a href="../HTML/Italien.html">Italy <3</a>

    <
    div class="clearer"></div>
    </
    div>
    <
    div id="main">
    <
    div class="left">
    <
    script src='http://www.google-analytics.com/ga.js' type='text/javascript'></script>
    <script type="text/javascript">
    </script>
    <script type="text/javascript">fvar pageTracker = _gat._getTracker("UA-1833788-2");
    pageTracker._initData();
    pageTracker._trackPageview();
    </script>

    <div id="it2"><img src="http://sportard.wdr.de/wm2006/wm/news200606/26/img/7_fans_italien_dpa_400.jpg" width="auto" Height="auto" </div>
    <div id="it1"><img src="http://www.weltkarte.com/europa/italien/satellitenfoto_italien.jpg" width="400" Height="300" </div>
    <div id="fi"><img src="http://upload.wikimedia.org/wikipedia/en/thumb/e/e9/Forza_Italia.png/722px-Forza_Italia.png" width="400" Height="300" </div>
    <div id="img.1"><img src="http://farm2.static.flickr.com/1331/1304880589_92e8080770.jpg?v=0" class="Am Meer"</div>


    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <p><h2>Viva la Italia!</h2>

    In diesem Teil der Seite gehts nur um Italien <3
    </p> 
    <table align="left" width="300" border="1" bgcolor="#6699FF" style="border-style: double; border-color: #6633FF;"><tr><td valign="middle" align="left">Amtsprache</td><td valign="middle" align="left">Italienisch</td></tr><tr><td valign="middle" align="left">Hauptstadt</td><td valign="middle" align="left">Rom</td></tr><tr><td valign="middle" align="left">Fläche</td><td valign="middle" align="left">301.336 km²</td></tr><tr><td valign="middle" align="left">Einwohnerzahl</td><td valign="middle" align="left">59.619.290 (31. Dezember 2007)</td></tr><tr><td valign="middle" align="left">Währung</td><td valign="middle" align="left">Euro</td></tr><tr><td valign="middle" align="left">Nationalhymne</td><td valign="middle" align="left"><a href="http://de.wikipedia.org/wiki/Fratelli_d%E2%80%99Italia">Fratelli d'Italia</a></td></tr></table>

    <SCRIPT language=JavaScript1.2>
    var no = 12; // snow number
    var speed = 6; // smaller number moves the shamrocks faster
    var snowflake = "http://tbn0.google.com/images?q=tbn:FUvv15Z9qs3HLM:http://www.bezirksseiten.at/europa/images/italien.gif";
    var ns4up = (document.layers) ? 1 : 0; // browser sniffer
    var ie4up = (document.all) ? 1 : 0;
    var dx, xp, yp; // coordinate and position variables
    var am, stx, sty; // amplitude and step variables
    var i, doc_width = 800, doc_height = 600;
    if (ns4up) {
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
    } else if (ie4up) {
    doc_width = document.body.clientWidth;
    doc_height = document.body.clientHeight;
    }
    dx = new Array();
    xp = new Array();
    yp = new Array();
    am = new Array();
    stx = new Array();
    sty = new Array();
    for (i = 0; i < no; ++ i) {
    dx[i] = 0; // set coordinate variables
    xp[i] = Math.random()*(doc_width-50); // set position variables
    yp[i] = Math.random()*doc_height;
    am[i] = Math.random()*0; // set amplitude variables
    stx[i] = 0.02 + Math.random()/10; // set step variables
    sty[i] = 0.7 + Math.random(); // set step variables
    if (ns4up) { // set layers
    if (i == 0) {
    document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
    document.write("top=\"15\" visibility=\"show\"><img src=\"");
    document.write(snowflake + "\" border=\"0\"></layer>");
    } else {
    document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
    document.write("top=\"15\" visibility=\"show\"><img src=\"");
    document.write(snowflake + "\" border=\"0\"></layer>");
    }
    } else if (ie4up) {
    if (i == 0) {
    document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
    document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
    document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
    document.write(snowflake + "\" border=\"0\"></div>");
    } else {
    document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
    document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
    document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
    document.write(snowflake + "\" border=\"0\"></div>");
    }
    }
    }
    function snowNS() { // Netscape main animation function
    for (i = 0; i < no; ++ i) { // iterate for every dot
    yp[i] += sty[i];
    if (yp[i] > doc_height-50) {
    xp[i] = Math.random()*(doc_width-am[i]-30);
    yp[i] = 0;
    stx[i] = 0.02 + Math.random()/10;
    sty[i] = 0.7 + Math.random();
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
    }
    dx[i] += stx[i];
    document.layers["dot"+i].top = yp[i];
    document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);
    }
    setTimeout("snowNS()", speed);
    }
    function snowIE() { // IE main animation function
    for (i = 0; i < no; ++ i) { // iterate for every dot
    yp[i] += sty[i];
    if (yp[i] > doc_height-50) {
    xp[i] = Math.random()*(doc_width-am[i]-30);
    yp[i] = 0;
    stx[i] = 0.02 + Math.random()/10;
    sty[i] = 0.7 + Math.random();
    doc_width = document.body.clientWidth;
    doc_height = document.body.clientHeight;
    }
    dx[i] += stx[i];
    document.all["dot"+i].style.pixelTop = yp[i];
    document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);
    }
    setTimeout("snowIE()", speed);
    }
    if (ns4up) {
    snowNS();
    } else if (ie4up) {
    snowIE();
    }
    </SCRIPT>

    </body>
    </html> 
    Also, mein erstes Problem ist, wie positioniere ich es richtig?
    Habe das fi.jpg richtig positioniert, weiss nicht so recht ob ich da alles richtig hab.
    Zweites Problem:
    Die Tabelle verschiebt sich mit meinem Bild nach rechts, ebenfalls der Schauer der Flaggen.
    Was habe ich vergessen, also wie halte ich die spezielle Einstellung für fi.jpg von der tabelle und dem schauer/regen der flaggen fern?
    Und wie mache ich eine slideshow bzw. wie kann ich die bilder in klein zeigen und wenn man drauf klickt wirds gross...
    Habt ihr sonst noch tipps oder so?

    Achja, habe son code bekomme wo man das macht das das bild klein ist und wenn man drüber geht wirds gross, doch es geht nicht, was ist falsch?
    Hoffe diesmal könnt ihr mir helfen...

  2. Anzeige

    Probleme mit HTML und CSS!

    Schau dir mal diesen Bereich an. Dort ist für jeden was dabei!
  3. #2
    martin-josef martin-josef ist offline
    Avatar von martin-josef

    AW: Probleme mit HTML und CSS!

    Hallo
    der thread wäre in dem Forum Kreative Ecke besser aufgehoben. Bitte den zust. Mod.. per PN dieses zu tätigen.
    gruß
    martin-josef

  4. #3
    sprinttom sprinttom ist offline
    Avatar von sprinttom

    AW: Probleme mit HTML und CSS!

    Hier ist die Lösung...
    SELFHTML 8.1.2 (HTML-Dateien selbst erstellen)

    Allerdings mit einigem an Selbstinitiative...

  5. #4
    SurviveX SurviveX ist offline
    Avatar von SurviveX

    AW: Probleme mit HTML und CSS!

    sprinttom, ich war schon dort, doch ich konnte nichts dazu finden =/
    martin-josef, es gehört ja zum computer und ich glaube weniger das es dort besser ist, wie dem auch sei, ich frag mal einen mod

  6. #5
    Incubali Incubali ist offline
    Avatar von Incubali

    AW: Probleme mit HTML und CSS!

    also mit deinem kompletten code fang ich so nicht viel an.
    da muss ich mir ja alles raussuchen wenn ich dir helfen will.
    poste bitte mal nur deine problemstellen im code.

    Also, mein erstes Problem ist, wie positioniere ich es richtig?
    was denn genau???

    Die Tabelle verschiebt sich mit meinem Bild nach rechts, ebenfalls der Schauer der Flaggen.
    tabellen zum popsitionieren zu verwenden ist sehr veraltet. ich würde das bild einfach in einem div anlegen. lässt sich perfekt und pixelgenau per css positionieren.

    tipps:
    dein css-code würde ich als extra datei auslagern. das macht den kompletten code sehr viel übersichtlicher :P

  7. #6
    SurviveX SurviveX ist offline
    Avatar von SurviveX

    AW: Probleme mit HTML und CSS!

    Zitat Incubali Beitrag anzeigen
    also mit deinem kompletten code fang ich so nicht viel an.
    da muss ich mir ja alles raussuchen wenn ich dir helfen will.
    poste bitte mal nur deine problemstellen im code.


    was denn genau???

    ich meine es allgemein... wills ohne tabelle positionieren, weiss aber nicht ob ich es richtig gemacht habe, schau mal kurz nach ^^"


    tabellen zum popsitionieren zu verwenden ist sehr veraltet. ich würde das bild einfach in einem div anlegen. lässt sich perfekt und pixelgenau per css positionieren.

    ja das ist ja das problem. ich habe meine bilder alle ohne tabellen positioniert. aber ich selbst hab auch ne tabelle erstellt mit inhalt ect.
    und das </div> klappt nicht, das bild wird mit der tabelle zusammen verschoben...


    tipps:
    dein css-code würde ich als extra datei auslagern. das macht den kompletten code sehr viel übersichtlicher :P
    Hier ist die aktuelle version.
    pls, kanns du das mal als html speichern und es dir ansehen

    PHP-Code:
    <html>
    <
    head>

    <
    BODY LINK="#00FF00" TEXT="#FF0000" VLINK="#FF0000" ALINK="#00FF00" BGCOLOR="#000000"></body>
    <
    style type="text/css">
    #fi {
      
    positionabsolute;
      
    top510px;
      
    left425px;
    }
    #it1 {
      
    positionabsolute;
      
    top200px;
      
    left425px;
    }
    #it2 {
      
    positionabsolute;
      
    top200px;
      
    left10px;
    }


    #img.1 {
    width200px;
    height150px;
    }

    #img.1 hover {
    widthauto;
    heightauto;
    }

    #img.1 {
    positionabsolute;
    top300px;
    left700px;
    }


    /* Navigation */
    .navigation a:hover {background-positionleft bottomcolor#456;}
    .navigation {
    height41px;
    border-left1px solid #B5D99D;
    border-right100px solid #B5D99D;
    border-bottom100px solid #D9E1E5;
    background-color#0000FF;
    background-imageurl(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);
    }
    .
    navigation a {
    displayblock;
    floatleft;
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);
    border-left1px solid #DBEACD;
    color#253 !important;
    line-height1px;
    text-decorationnone !important
    font-weightbold
    font-size1.1em
    font-familysans-serif
    padding0 20px;
    }
    .
    navigation ul {list-stylenonefloatleft;}
    .
    navigation ul li {floatleftdisplayblockposition:relative;}
    .
    navigation ul li ul {position:absolutedisplay:nonetop:100%; left:-19px;}
    .
    navigation ul li ul a {line-height:20pxheight:20pxwidth:100px
    border-right1px solid #DBEACD; font-size:1em;
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);}
    .navigation ul li:hover ul {display:block;}
    .
    navigation ul li:before {content:no-open-quote !important;}
    .
    navigation ul li {text-indent0emmargin-left0em;}
    </
    style>
    <
    title>Startseite</title>
    </
    head>
    <
    body>
    <
    style type="text/css">
    /* Navigation */
    .navigation a:hover {background-positionleft bottomcolor#234;}
    .navigation {   
    height1px;
    border-left1px solid #B5D99D; 
    border-right100px solid #B5D99D; 
    border-bottom1px solid #D9E1E5; 
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg); 
    }
    .
    navigation a {
    displayblock;
    floatleft;
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);
    border-left1px solid #DBEACD;
    color#456 !important;
    line-height41px;
    text-decorationnone !important
    font-weightbold
    font-size1.1em
    font-familysans-serif
    padding0 20px;
    }
    .
    navigation ul {list-stylenonefloatleft;}
    .
    navigation ul li {floatleftdisplayblockposition:relative;}
    .
    navigation ul li ul {position:absolutedisplay:nonetop:100%; left:-19px;}
    .
    navigation ul li ul a {line-height:20pxheight:20pxwidth:100px
    border-right1px solid #DBEACD; font-size:1em;
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);}
    .navigation ul li:hover ul {display:block;}
    .
    navigation ul li:before {content:no-open-quote !important;}
    .
    navigation ul li {text-indent0emmargin-left0em;}
    </
    style>
    <!
    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>
    <
    title>Startseite </title>
    <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <
    style type="text/css" media="all"
       </
    style>
    <
    meta name="robots" content="index,follow" />
    <
    meta http-equiv="Content-Language" content="de" />
    <!--[if 
    IE]><style type="text/css" media="all"> @import url(); </style><![endif]--><body class="body" id="seite_20">
    <
    div id="top">
    <
    div id="pfad"><strong><a href="http://schulefeld.ch">Schule Feld</a></strong> &gt; <a href="http://schulefeld.ch/wf/Andrea">Andrea</a> &gtStartseite</div>
    <
    div id="suche">
      
    </
    div>
    </
    div>
    <
    div id="rahmen">
    <
    h1>Startseite</h1>
    <
    div id="rahmen">
    <
    table CELLSPACING="4" CELLPADDING="6" ALIGN="Center" border="5" width="96">
    <
    tr>
    <
    td align="center" bgcolor="#FFFFFF" width="53"><a href="#"
    onmouseover="document.bgColor='#6699FF'"><font color="#6699FF">Hellblau</font></td>
    <
    td align="center" bgcolor="#FFFAEA" width="53"></a><a href="#"
    onmouseover="document.bgColor='#fffaea'"><font color="#FFFAEA">Weiss</font></td>
    <
    td align="center" bgcolor="#CCCCCC" width="54"></a><a href="#"
    onmouseover="document.bgColor='#cccccc'"><font color="#CCCCCC">Silber</font></td>
    </
    a><td align="center" bgcolor="#000000" width="54"><font color="#000000"><a href="#"
    onmouseover="document.bgColor='#000000'">Schwarz</a></font></td>
    </
    tr>
    </
    table>





    </
    div>
    <
    div class="navigation">
    <
    a href="../HTML/Index.html">Home</a>
    <
    a href="../HTML/Ich.html">Über mich</a>
    <
    a href="../HTML/Sport.html">Sport</a>
    <
    a href="../HTML/Italien.html">Italy <3</a>

    <
    div class="clearer"></div>
    </
    div>
    <
    div id="main">
    <
    div class="left">
    <
    script src='http://www.google-analytics.com/ga.js' type='text/javascript'></script>
    <script type="text/javascript">
    </script>
    <script type="text/javascript">fvar pageTracker = _gat._getTracker("UA-1833788-2");
    pageTracker._initData();
    pageTracker._trackPageview();
    </script>

    <div id="it2"><img src="http://sportard.wdr.de/wm2006/wm/news200606/26/img/7_fans_italien_dpa_400.jpg" width="auto" Height="auto" </div>
    <div id="it1"><img src="http://www.weltkarte.com/europa/italien/satellitenfoto_italien.jpg" width="400" Height="300" </div>
    <div id="fi"><img src="http://upload.wikimedia.org/wikipedia/en/thumb/e/e9/Forza_Italia.png/722px-Forza_Italia.png" width="400" Height="300" </div>
    <div id="img.1"><img src="http://farm2.static.flickr.com/1331/1304880589_92e8080770.jpg?v=0" class="Am Meer"</div>


    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <p><h2>Viva la Italia!</h2>

    In diesem Teil der Seite gehts nur um Italien <3
    </p> 
    <table align="left" width="300" border="1" bgcolor="#6699FF" style="border-style: double; border-color: #6633FF;"><tr><td valign="middle" align="left">Amtsprache</td><td valign="middle" align="left">Italienisch</td></tr><tr><td valign="middle" align="left">Hauptstadt</td><td valign="middle" align="left">Rom</td></tr><tr><td valign="middle" align="left">Fläche</td><td valign="middle" align="left">301.336 km²</td></tr><tr><td valign="middle" align="left">Einwohnerzahl</td><td valign="middle" align="left">59.619.290 (31. Dezember 2007)</td></tr><tr><td valign="middle" align="left">Währung</td><td valign="middle" align="left">Euro</td></tr><tr><td valign="middle" align="left">Nationalhymne</td><td valign="middle" align="left"><a href="http://de.wikipedia.org/wiki/Fratelli_d%E2%80%99Italia">Fratelli d'Italia</a></td></tr></table>

    <SCRIPT language=JavaScript1.2>
    var no = 12; // snow number
    var speed = 6; // smaller number moves the shamrocks faster
    var snowflake = "http://tbn0.google.com/images?q=tbn:FUvv15Z9qs3HLM:http://www.bezirksseiten.at/europa/images/italien.gif";
    var ns4up = (document.layers) ? 1 : 0; // browser sniffer
    var ie4up = (document.all) ? 1 : 0;
    var dx, xp, yp; // coordinate and position variables
    var am, stx, sty; // amplitude and step variables
    var i, doc_width = 800, doc_height = 600;
    if (ns4up) {
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
    } else if (ie4up) {
    doc_width = document.body.clientWidth;
    doc_height = document.body.clientHeight;
    }
    dx = new Array();
    xp = new Array();
    yp = new Array();
    am = new Array();
    stx = new Array();
    sty = new Array();
    for (i = 0; i < no; ++ i) {
    dx[i] = 0; // set coordinate variables
    xp[i] = Math.random()*(doc_width-50); // set position variables
    yp[i] = Math.random()*doc_height;
    am[i] = Math.random()*0; // set amplitude variables
    stx[i] = 0.02 + Math.random()/10; // set step variables
    sty[i] = 0.7 + Math.random(); // set step variables
    if (ns4up) { // set layers
    if (i == 0) {
    document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
    document.write("top=\"15\" visibility=\"show\"><img src=\"");
    document.write(snowflake + "\" border=\"0\"></layer>");
    } else {
    document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
    document.write("top=\"15\" visibility=\"show\"><img src=\"");
    document.write(snowflake + "\" border=\"0\"></layer>");
    }
    } else if (ie4up) {
    if (i == 0) {
    document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
    document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
    document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
    document.write(snowflake + "\" border=\"0\"></div>");
    } else {
    document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
    document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
    document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
    document.write(snowflake + "\" border=\"0\"></div>");
    }
    }
    }
    function snowNS() { // Netscape main animation function
    for (i = 0; i < no; ++ i) { // iterate for every dot
    yp[i] += sty[i];
    if (yp[i] > doc_height-50) {
    xp[i] = Math.random()*(doc_width-am[i]-30);
    yp[i] = 0;
    stx[i] = 0.02 + Math.random()/10;
    sty[i] = 0.7 + Math.random();
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
    }
    dx[i] += stx[i];
    document.layers["dot"+i].top = yp[i];
    document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);
    }
    setTimeout("snowNS()", speed);
    }
    function snowIE() { // IE main animation function
    for (i = 0; i < no; ++ i) { // iterate for every dot
    yp[i] += sty[i];
    if (yp[i] > doc_height-50) {
    xp[i] = Math.random()*(doc_width-am[i]-30);
    yp[i] = 0;
    stx[i] = 0.02 + Math.random()/10;
    sty[i] = 0.7 + Math.random();
    doc_width = document.body.clientWidth;
    doc_height = document.body.clientHeight;
    }
    dx[i] += stx[i];
    document.all["dot"+i].style.pixelTop = yp[i];
    document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);
    }
    setTimeout("snowIE()", speed);
    }
    if (ns4up) {
    snowNS();
    } else if (ie4up) {
    snowIE();
    }
    </SCRIPT>

    </body>
    </html> 
    wenn ich es auf safari öffne siehts ok aus, einfach der regen fehlt, und auf Internet Explorer sieht es katastophal aus, warum???

  8. #7
    Das_Es Das_Es ist offline
    Avatar von Das_Es

    AW: Probleme mit HTML und CSS!

    HTML-Code:
    <!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>
    
    	<style type="text/css">
    		#fi {
    		  position: absolute;
    		  top: 510px;
    		  left: 425px;
    		}
    		#it1 {
    		  position: absolute;
    		  top: 200px;
    		  left: 425px;
    		}
    		#it2 {
    		  position: absolute;
    		  top: 200px;
    		  left: 10px;
    		}
    
    
    		#img1 {
    		width: 200px;
    		height: 150px;
    		}
    
    		#img1:hover {
    		width: auto;
    		height: auto;
    		}
    
    		#img1 {
    		position: absolute;
    		top: 300px;
    		left: 700px;
    		}
    
    
    		/* Navigation */
    		.navigation a:hover {background-position: left bottom; color: #456;}
    		.navigation {
    			height: 41px;
    			border-left: 1px solid #B5D99D;
    			border-right: 100px solid #B5D99D;
    			border-bottom: 100px solid #D9E1E5;
    			background-color: #0000FF;
    			background-image: url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);
    		}
    		.navigation a {
    			display: block;
    			float: left;
    			background: #D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);
    			border-left: 1px solid #DBEACD;
    			color: #253 !important;
    			line-height: 1px;
    			text-decoration: none !important; 
    			font-weight: bold; 
    			font-size: 1.1em; 
    			font-family: sans-serif; 
    			padding: 0 20px;
    		}
    		.navigation ul {list-style: none; float: left;}
    		.navigation ul li {float: left; display: block; position:relative;}
    		.navigation ul li ul {position:absolute; display:none; top:100%; left:-19px;}
    		.navigation ul li ul a {line-height:20px; height:20px; width:100px; 
    		border-right: 1px solid #DBEACD; font-size:1em;
    		background: #D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);}
    		.navigation ul li:hover ul {display:block;}
    		.navigation ul li:before {content:no-open-quote !important;}
    		.navigation ul li {text-indent: 0em; margin-left: 0em;}
    	</style>
    
    	<style type="text/css">
    		/* Navigation */
    		.navigation a:hover {background-position: left bottom; color: #234;}
    		.navigation {   
    		height: 1px;
    		border-left: 1px solid #B5D99D; 
    		border-right: 100px solid #B5D99D; 
    		border-bottom: 1px solid #D9E1E5; 
    		background: #D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg); 
    		}
    		.navigation a {
    		display: block;
    		float: left;
    		background: #D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);
    		border-left: 1px solid #DBEACD;
    		color: #456 !important;
    		line-height: 41px;
    		text-decoration: none !important; 
    		font-weight: bold; 
    		font-size: 1.1em; 
    		font-family: sans-serif; 
    		padding: 0 20px;
    		}
    		.navigation ul {list-style: none; float: left;}
    		.navigation ul li {float: left; display: block; position:relative;}
    		.navigation ul li ul {position:absolute; display:none; top:100%; left:-19px;}
    		.navigation ul li ul a {line-height:20px; height:20px; width:100px; 
    		border-right: 1px solid #DBEACD; font-size:1em;
    		background: #D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);}
    		.navigation ul li:hover ul {display:block;}
    		.navigation ul li:before {content:no-open-quote !important;}
    		.navigation ul li {text-indent: 0em; margin-left: 0em;}
    	</style>
    
    
    <title>Startseite </title>
    
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <meta name="robots" content="index,follow" />
    <meta http-equiv="Content-Language" content="de" />
    
    
    
    <body class="body" id="seite_20">
    
    <div id="top">
    	<div id="pfad"><strong><a href="http://schulefeld.ch">Schule Feld</a></strong> &gt; <a href="http://schulefeld.ch/wf/Andrea">Andrea</a> &gt; Startseite</div>
    	<div id="suche">
    	  
    	</div>
    </div>
    
    <div id="rahmen">
    	<h1>Startseite</h1>
    		<div id="rahmen">
    			<table CELLSPACING="4" CELLPADDING="6" ALIGN="Center" border="5" width="96">
    			<tr>
    			<td align="center" bgcolor="#FFFFFF" width="53"><a href="#"
    			onmouseover="document.bgColor='#6699FF'"><font color="#6699FF">Hellblau</font></td>
    			<td align="center" bgcolor="#FFFAEA" width="53"></a><a href="#"
    			onmouseover="document.bgColor='#fffaea'"><font color="#FFFAEA">Weiss</font></td>
    			<td align="center" bgcolor="#CCCCCC" width="54"></a><a href="#"
    			onmouseover="document.bgColor='#cccccc'"><font color="#CCCCCC">Silber</font></td>
    			</a><td align="center" bgcolor="#000000" width="54"><font color="#000000"><a href="#"
    			onmouseover="document.bgColor='#000000'">Schwarz</a></font></td>
    			</tr>
    			</table>
    		</div>
    		<div class="navigation">
    		<a href="http://www.forumla.de/HTML/Index.html">Home</a>
    		<a href="http://www.forumla.de/HTML/Ich.html">Über mich</a>
    		<a href="http://www.forumla.de/HTML/Sport.html">Sport</a>
    		<a href="http://www.forumla.de/HTML/Italien.html">Italy &lt;3</a>
    
    		<div class="clearer"></div>
    	</div>
    	
    	<div id="main">
    	<div class="left">
    		<!--<script src='http://www.google-analytics.com/ga.js' type='text/javascript'></script>-->
    
    		<!--<script type="text/javascript">var pageTracker = _gat._getTracker("UA-1833788-2");
    			pageTracker._initData();
    			pageTracker._trackPageview();
    			</script> -->
    
    	<div id="it2"><img src="http://sportard.wdr.de/wm2006/wm/news200606/26/img/7_fans_italien_dpa_400.jpg" width="400" height="300" /></div>
    	<div id="it1"><img src="http://www.weltkarte.com/europa/italien/satellitenfoto_italien.jpg" width="400" height="300" /></div>
    	<div id="fi"><img src="http://upload.wikimedia.org/wikipedia/en/thumb/e/e9/Forza_Italia.png/722px-Forza_Italia.png" width="400" height="300" /></div>
    	<div id="img1"><img src="http://farm2.static.flickr.com/1331/1304880589_92e8080770.jpg?v=0" class="Am Meer" /></div>
    
    
    
    	<p style="margin-top:350px; ">
    		<h2>Viva la Italia!</h2>
    
    		In diesem Teil der Seite gehts nur um Italien &lt;3
    	</p> 
    	<table align="left" width="300" border="1" bgcolor="#6699FF" style="border-style: double; border-color: #6633FF;">
    		<tr>
    			<td valign="middle" align="left">Amtsprache</td>
    			<td valign="middle" align="left">Italienisch</td>
    		</tr>
    		<tr>
    			<td valign="middle" align="left">Hauptstadt</td>
    			<td valign="middle" align="left">Rom</td>
    		</tr>
    		<tr>
    			<td valign="middle" align="left">Fläche</td>
    			<td valign="middle" align="left">301.336 km²</td>
    		</tr>
    		<tr>
    			<td valign="middle" align="left">Einwohnerzahl</td>
    			<td valign="middle" align="left">59.619.290 (31. Dezember 2007)</td>
    		</tr>
    		<tr>
    			<td valign="middle" align="left">Währung</td>
    			<td valign="middle" align="left">Euro</td>
    		</tr>
    		<tr>
    			<td valign="middle" align="left">Nationalhymne</td>
    			<td valign="middle" align="left"><a href="http://de.wikipedia.org/wiki/Fratelli_d%E2%80%99Italia">Fratelli d'Italia</a></td>
    		</tr>
    	</table>
    
    <script type="text/javascript">
    var no = 12; // snow number
    var speed = 6; // smaller number moves the shamrocks faster
    var snowflake = "http://tbn0.google.com/images?q=tbn:FUvv15Z9qs3HLM:http://www.bezirksseiten.at/europa/images/italien.gif";
    
    var dx, xp, yp; // coordinate and position variables
    var am, stx, sty; // amplitude and step variables
    var i, doc_width = 800, doc_height = 600;
    
    doc_width = (self.innerWidth?self.innerWidth:document.body.clientWidth) - 20; // -20 als Sicherheit
    doc_height = (self.innerHeight?self.innerHeight:document.body.clientHeight);
    
    dx = new Array();
    xp = new Array();
    yp = new Array();
    am = new Array();
    stx = new Array();
    sty = new Array();
    for (i = 0; i < no; ++ i) {
    	dx[i] = 0; // set coordinate variables
    	xp[i] = Math.random()*(doc_width-50); // set position variables
    	yp[i] = Math.random()*doc_height;
    	am[i] = Math.random()*0; // set amplitude variables
    	stx[i] = 0.02 + Math.random()/10; // set step variables
    	sty[i] = 0.7 + Math.random(); // set step variables
    
    	if (i == 0) {
    		document.write("<div id=\"dot"+ i +"\" style=\"position: ");
    		document.write("fixed; z-index: "+ i +"; visibility: ");
    		document.write("visible; top: 15px; left: 15px;\"><img src=\"");
    		document.write(snowflake + "\" border=\"0\"></div>");
    	} else {
    		document.write("<div id=\"dot"+ i +"\" style=\"position: ");
    		document.write("fixed; z-index: "+ i +"; visibility: ");
    		document.write("visible; top: 15px; left: 15px;\"><img src=\"");
    		document.write(snowflake + "\" border=\"0\"></div>");
    	}
    
    }
    
    function snowNS() { // Netscape main animation function
    	for (i = 0; i < no; ++ i) { // iterate for every dot
    		yp[i] += sty[i];
    		if (yp[i] > doc_height-50) {
    			xp[i] = Math.random()*(doc_width-am[i]-30);
    			yp[i] = 0;
    			stx[i] = 0.02 + Math.random()/10;
    			sty[i] = 0.7 + Math.random();
    			doc_width = self.innerWidth?self.innerWidth:document.body.clientWidth; // NS oder IE
    			doc_height = self.innerHeight?self.innerHeight:document.body.clientHeight; // NS oder IE
    		}
    		dx[i] += stx[i];
    		document.getElementById("dot"+i).style.top = yp[i] + "px";
    		document.getElementById("dot"+i).style.left = (xp[i] + am[i]*Math.sin(dx[i])) + "px";
    	}
    	setTimeout("snowNS()", speed);
    }
    
    
    snowNS();
    </script>
    
    </body>
    </html>   
    wohar was hast du da für Spagetti gemacht oO
    Fangen wir mal an

    • DOCTYPE muss immer am anfang stehen, es darf nichts dafor stehen (keine leerzeichen oder leerzeilen)
    • du hast jede menge body tags drine. 1 reicht.
    • du definisert oben bei der style auch gerne mal was mehrfach
    • bilder müssen auch geschossen werden
      war vor her so: <img blabla widht="30" <div> ...
      jetzt ist es so: <img blabla widht="30" /><div> ... (das /> und nicht > weil du in der Doctype sagst das du den XHTML standart willst)
    • als id name darfst du kein Punkt benutzer weil bei der Stil-Definition ein Punkt sagt das es sich um eine Klasse handelt
      beisp #blub.c heißt das sich der stil auf alles auswirk was der klasse c angehört under der id Blub:
      <div id="blub"><img class="c" ... /></div>
    • Warum brauchst du Google Analystics?
    • Das Falggen script war auch unnötigt (groß) und nach aktuellen Standart Funktions beeinträchtigt

    Allen in allen gibt es da noch einiges zu tun nur haben ich mal das auffäligste gemacht

  9. #8
    SurviveX SurviveX ist offline
    Avatar von SurviveX

    AW: Probleme mit HTML und CSS!

    Hab mal weiter gearbeitet, wie ist es so?
    PHP-Code:
    <html>
    <
    head>
    <
    title>Motorsport</title>
    <
    BODY LINK="#00FF00" TEXT="#FF0000" VLINK="#FF0000" ALINK="#00FF00" BGCOLOR="#000000"></body>
    <
    style type="text/css">
    /* Navigation */
    .navigation a:hover {background-positionleft bottomcolor#456;}
    .navigation {
     
    height41px;
     
    border-left1px solid #B5D99D;
     
    border-right100px solid #B5D99D;
     
    border-bottom100px solid #D9E1E5;
     
    background-color#0000FF;
     
    background-imageurl(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);
    }
    .
    navigation a {
    displayblock;
    floatleft;
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);
    border-left1px solid #DBEACD;
    color#253 !important;
    line-height1px;
    text-decorationnone !important
    font-weightbold
    font-size1.1em
    font-familysans-serif
    padding0 20px;
    }
    .
    navigation ul {list-stylenonefloatleft;}
    .
    navigation ul li {floatleftdisplayblockposition:relative;}
    .
    navigation ul li ul {position:absolutedisplay:nonetop:100%; left:-19px;}
    .
    navigation ul li ul a {line-height:20pxheight:20pxwidth:100px
    border-right1px solid #DBEACD; font-size:1em;
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);}
    .navigation ul li:hover ul {display:block;}
    .
    navigation ul li:before {content:no-open-quote !important;}
    .
    navigation ul li {text-indent0emmargin-left0em;}
    </
    style>
    </
    head>
    <
    body>
    <
    style type="text/css">
    /* Navigation */
    .navigation a:hover {background-positionleft bottomcolor#234;}
    .navigation {   
    height1px;
    border-left1px solid #B5D99D; 
    border-right100px solid #B5D99D; 
    border-bottom1px solid #D9E1E5; 
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg); 
    }
    .
    navigation a {
    displayblock;
    floatleft;
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);
    border-left1px solid #DBEACD;
    color#456 !important;
    line-height41px;
    text-decorationnone !important
    font-weightbold
    font-size1.1em
    font-familysans-serif
    padding0 20px;
    }
    .
    navigation ul {list-stylenonefloatleft;}
    .
    navigation ul li {floatleftdisplayblockposition:relative;}
    .
    navigation ul li ul {position:absolutedisplay:nonetop:100%; left:-19px;}
    .
    navigation ul li ul a {line-height:20pxheight:20pxwidth:100px
    border-right1px solid #DBEACD; font-size:1em;
    background#D9E1E5 url(http://i214.photobucket.com/albums/cc190/Bycoja/navi.jpg);}
    .navigation ul li:hover ul {display:block;}
    .
    navigation ul li:before {content:no-open-quote !important;}
    .
    navigation ul li {text-indent0emmargin-left0em;}
    </
    style>
    <!
    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>
     <
    title>Startseite </title>
     <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
     <
    style type="text/css" media="all"
       </
    style>
     <
    meta name="robots" content="index,follow" />
     <
    meta http-equiv="Content-Language" content="de" />
     <!--[if 
    IE]><style type="text/css" media="all"> @import url(); </style><![endif]--><body 
    class="body" id="seite_20">
    <
    div id="top">
     <
    div id="pfad"><strong><a href="http://schulefeld.ch">Schule Feld</a></strong> &gt; <
    href
    ="http://schulefeld.ch/wf/Andrea">Andrea</a> &gtStartseite</div>
     <
    div id="suche">
      
     </
    div>
    </
    div>
    <
    div id="rahmen">
    <
    h1>Startseite</h1>
    <
    div id="rahmen">
    <
    table CELLSPACING="4" CELLPADDING="6" ALIGN="Center" border="5" width="96">
    <
    tr>
    <
    td align="center" bgcolor="#FFFFFF" width="53"><a href="#"
    onmouseover="document.bgColor='#6699FF'"><font color="#6699FF">hellblau</font></td>
    <
    td align="center" bgcolor="#FFFAEA" width="53"></a><a href="#"
    onmouseover="document.bgColor='#fffaea'"><font color="#FFFAEA">beige</font></td>
    <
    td align="center" bgcolor="#CCCCCC" width="54"></a><a href="#"
    onmouseover="document.bgColor='#cccccc'"><font color="#CCCCCC">silber</font></td>
    </
    a><td align="center" bgcolor="#000000" width="54"><font color="#000000"><a href="#"
    onmouseover="document.bgColor='#000000'">schwarz</a></font></td>
    </
    tr>
    </
    table>
     
     
     
     
     
    </
    div>
    <
    div class="navigation">
    <
    a href="http://schulefeld.ch/wf/andrea">Home</a>
    <
    a href="http://schulefeld.ch/wf/andrea/ich">Über mich</a>
    <
    a href="http://schulefeld.ch/wf/andrea/sport">Sport</a>
    <
    a href="http://schulefeld.ch/wf/andrea/italien">Italy <3</a>
     
    <
    div class="clearer"></div>
    </
    div>
    <
    div id="main">
    <
    div class="left">
    <
    script src='http://www.google-analytics.com/ga.js' type='text/javascript'></script>
    <script type="text/javascript">
    </script>
    <script type="text/javascript">fvar pageTracker = _gat._getTracker("UA-1833788-2");
    pageTracker._initData();
    pageTracker._trackPageview();
    </script>
     

    <a href="http://www.forumla.de/HTML/Bilder/GT.jpg" target="_blank">
    <img src="http://www.forumla.de/HTML/Bilder/GT.jpg" width="100" height="80" alt="Citroën Gran Turismo; Verwirklichung 
    eines Games- Wagen!" border="0">
    </a>
    <a href="http://www.forumla.de/HTML/Bilder/nissan370z.jpg" target="_blank">
    <img src="http://www.forumla.de/HTML/Bilder/nissan370z.jpg" width="100" height="80" alt="Nissan 350z/ 370z; gleicher 
    Style, bessere Leistung." border="0">
    </a>
    <a href="http://www.forumla.de/HTML/Bilder/lambgalla1.jpg" target="_blank">
    <img src="http://www.forumla.de/HTML/Bilder/lambgalla1.jpg" width="100" height="80" alt="Lamborghini Gallardo 
    Superleggera; Beschleunigung von 0 auf 100 km/h in 3,8 Sekunden." border="0">
    </a>
    <a href="http://www.forumla.de/HTML/Bilder/felgen1.jpg" target="_blank">
    <img src="http://www.forumla.de/HTML/Bilder/felgen1.jpg" width="100" height="80" alt="Chromfelgen" border="0">
    </a>
    <a href="http://www.forumla.de/HTML/Bilder/felgen2.jpg" target="_blank">
    <img src="http://www.forumla.de/HTML/Bilder/felgen2.jpg" width="100" height="80" alt="Chromfelgen (2)" border="0">
    </a>
    <a href="http://www.forumla.de/HTML/Bilder/audir8.jpg" target="_blank">
    <img src="http://www.forumla.de/HTML/Bilder/audir8.jpg" width="100" height="80" alt="Getunter Audi R8" border="0">
    </a>
    <a href="http://www.forumla.de/HTML/Bilder/lambomurc.jpg" target="_blank">
    <img src="http://www.forumla.de/HTML/Bilder/lambomurc.jpg" width="100" height="80" alt="Lamborghini Murcielago" 
    border="0">
    </a>
    <a href="http://www.forumla.de/HTML/Bilder/bmw.jpg" target="_blank">
    <img src="http://www.forumla.de/HTML/Bilder/bmw.jpg" width="100" height="80" alt="BMW M6" border="0">
    </a>
    <a href="http://www.forumla.de/HTML/Bilder/dodgeviper.jpg" target="_blank">
    <img src="http://www.forumla.de/HTML/Bilder/dodgeviper.jpg" width="100" height="80" alt="Dodge Viper" border="0">
    </a>
     
    </body>
    </html>
     
    <p> Maus über die Bilder halten für mehr Informationen... <p>
    <br>
    <br>
    Raketenauto  
    <object width="425" height="344"><param name="movie" 
    value="http://www.youtube.com/v/ss3Urbb3s2w&hl=en&fs=1"></param><param name="allowFullScreen" 
    value="true"></param><param name="allowscriptaccess" value="always"></param><embed 
    src="http://www.youtube.com/v/ss3Urbb3s2w&hl=en&fs=1" type="application/x-shockwave-flash" 
    allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>
    <p><br>
    Raketenwagen (2)
    <object width="425" height="344"><param name="movie" 
    value="http://www.youtube.com/v/74AkSBZoElM&hl=en&fs=1"></param><param name="allowFullScreen" 
    value="true"></param><param name="allowscriptaccess" value="always"></param><embed 
    src="http://www.youtube.com/v/74AkSBZoElM&hl=en&fs=1" type="application/x-shockwave-flash" 
    allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object> 
    <p><br>
    Raketenwagen (3)
    <object width="425" height="344"><param name="movie" 
    value="http://www.youtube.com/v/OgJW5oy4Hxs&hl=en&fs=1"></param><param name="allowFullScreen" 
    value="true"></param><param name="allowscriptaccess" value="always"></param><embed 
    src="http://www.youtube.com/v/OgJW5oy4Hxs&hl=en&fs=1" type="application/x-shockwave-flash" 
    allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>
    <p><br>
    <SCRIPT language=JavaScript1.2>
    var no = 12; // snow number
    var speed = 6; // smaller number moves the shamrocks faster
    var snowflake = 
    "http://tbn0.google.com/images?q=tbn:FUvv15Z9qs3HLM:http://www.bezirksseiten.at/europa/images/italie
    n.gif";
    var ns4up = (document.layers) ? 1 : 0; // browser sniffer
    var ie4up = (document.all) ? 1 : 0;
    var dx, xp, yp; // coordinate and position variables
    var am, stx, sty; // amplitude and step variables
    var i, doc_width = 800, doc_height = 600;
    if (ns4up) {
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
    } else if (ie4up) {
    doc_width = document.body.clientWidth;
    doc_height = document.body.clientHeight;
    }
    dx = new Array();
    xp = new Array();
    yp = new Array();
    am = new Array();
    stx = new Array();
    sty = new Array();
    for (i = 0; i < no; ++ i) {
    dx[i] = 0; // set coordinate variables
    xp[i] = Math.random()*(doc_width-50); // set position variables
    yp[i] = Math.random()*doc_height;
    am[i] = Math.random()*0; // set amplitude variables
    stx[i] = 0.02 + Math.random()/10; // set step variables
    sty[i] = 0.7 + Math.random(); // set step variables
    if (ns4up) { // set layers
    if (i == 0) {
    document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
    document.write("top=\"15\" visibility=\"show\"><img src=\"");
    document.write(snowflake + "\" border=\"0\"></layer>");
    } else {
    document.write("<layer name=\"dot"+ i +"\" left=\"15\" ");
    document.write("top=\"15\" visibility=\"show\"><img src=\"");
    document.write(snowflake + "\" border=\"0\"></layer>");
    }
    } else if (ie4up) {
    if (i == 0) {
    document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
    document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
    document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
    document.write(snowflake + "\" border=\"0\"></div>");
    } else {
    document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ");
    document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
    document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"");
    document.write(snowflake + "\" border=\"0\"></div>");
    }
    }
    }
    function snowNS() { // Netscape main animation function
    for (i = 0; i < no; ++ i) { // iterate for every dot
    yp[i] += sty[i];
    if (yp[i] > doc_height-50) {
    xp[i] = Math.random()*(doc_width-am[i]-30);
    yp[i] = 0;
    stx[i] = 0.02 + Math.random()/10;
    sty[i] = 0.7 + Math.random();
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
    }
    dx[i] += stx[i];
    document.layers["dot"+i].top = yp[i];
    document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);
    }
    setTimeout("snowNS()", speed);
    }
    function snowIE() { // IE main animation function
    for (i = 0; i < no; ++ i) { // iterate for every dot
    yp[i] += sty[i];
    if (yp[i] > doc_height-50) {
    xp[i] = Math.random()*(doc_width-am[i]-30);
    yp[i] = 0;
    stx[i] = 0.02 + Math.random()/10;
    sty[i] = 0.7 + Math.random();
    doc_width = document.body.clientWidth;
    doc_height = document.body.clientHeight;
    }
    dx[i] += stx[i];
    document.all["dot"+i].style.pixelTop = yp[i];
    document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);
    }
    setTimeout("snowIE()", speed);
    }
    if (ns4up) {
    snowNS();
    } else if (ie4up) {
    snowIE();
    }
    </SCRIPT> 

Ähnliche Themen


  1. .html auf DS: Wie kann man HTML Seiten ( mit Bildern, Spoilern,...) auf dem DS anschauen (offline, nicht online)?

  2. Html probleme...: Nabend, ich habe folgendes problem undzwar besteht meine hp (bzw das desing) aus tabellen. In einer zelle ist der gesamte untere Teil der homepage...

  3. Html: Hallo, ich wollte euch fragen, ob man seine HTML-dateien kostenlos in eine Seite bauen kann, die dann online ist? Bis jetzt habe ich den...

  4. Website-Probleme?!? Links gehen immer auf index.html: Ich bastle grad an meiner Website TechNewz.eu ich habe noch eine preload seite als "index.html" eingebaut. nach 6 sekunden solls zur website...

  5. HTML-Anfänger - Kennt jemand ne Site wo man lernt mit HTML zu progarmmieren?: Hi, also wie die Überschrift schon sagt würde ich gerne wissen ob es eine Site gibt wo man lernt wie man die schon etwas schwierigeren Sachen...