Html Website

    Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

    • Html Website

      Hallo Core'ler

      Hier ist der erste Veruch einer Homepage mit der HTML Sprache.(Phase 5 Editor benutzt)

      Bitte Ignoriert die falschen Angaben der Texte, sie sind kopiert aus einer Fanpage von S4 League.

      Und oben links das Bild will der scheiss ftp Server irgendwie nicht uploaden.

      Nja bewertet bitte nicht alzustreng :)

      waren ca. 2(nun 6) Std arbeit ^^

      So hier ist sie ;D

      http://akazuki.co.de/S4%20League/index.html





      MFG.

    • Werbung zur Unterstützung des Forums ( Bitte AddBlocker deaktivieren )

    • Für den ersten Versuch und nur 2h Arbeit ist das doch ganz ordentlich, dafür, dass du noch CSS und JavaScript mit eingebunden hast.
      Im Code sind ein paar Schönheitsfehler, aber die stören nicht zwingend.

      Die Stelle, wo das Menü mit dem unterem Bild überlappt sieht ewas doof aus, da links in der freien Spalte die Grafik noch teils zu sehen ist.

    • Also für den ersten Versuch nicht schlecht. Aber mach dich mal mit den Grundlagen vertraut. Du schreibst doch sehr "unsauber" dennoch gut dafür das es das erste mal ist.

      Zu deinem Problem mit dem Bild. Der server besitzt das Bild nur gibst du den Pfad falsch an.

      der genau Pfad zu deinem Bild ist folgender:

      Quellcode

      1. <div id="sp1zentriert"><img src="images/banner.png" width="300px"></div>


      Ich habe mal die b tags entfernt. So richtig kann ich den Nutzen dieser nicht abschätzen.

      Viel Spass damit

      Lieben Gruß
      Ulle

    • [x]Akazuki;196079 schrieb:

      das liegt am ftp server :S


      liegt daran das du hinter dem menü
      n gif bild als background genommen hast,
      das ganze lässt sich aber auch genauso mit javascript realisieren :)
      musst ma n bisel googlen
      ansonsten wie mein vorposter schon gesagt hast
      musst du bei ftp servern
      auf die groß und klein schreibung in den pfaden achten,
      local ist das egal, aber auf dem ftp muss dies
      genau angeben sein :>
      am besten immer alles klein schreiben^^

    • BizZi;196116 schrieb:

      liegt daran das du hinter dem menü
      n gif bild als background genommen hast,
      das ganze lässt sich aber auch genauso mit javascript realisieren :)
      musst ma n bisel googlen
      ansonsten wie mein vorposter schon gesagt hast
      musst du bei ftp servern
      auf die groß und klein schreibung in den pfaden achten,
      local ist das egal, aber auf dem ftp muss dies
      genau angeben sein :>
      am besten immer alles klein schreiben^^


      danke euch.

      ich editier das mal jetz ^-^

      Aber das war ja im grunde auch nur die beta-page ^-^

      ich werde mich noch länger mit ihr beschäftigen und etc.

      mfg

      //EDIT

      Problem wurde beseitigt.

      Riesenbilder bei der Gallerie werden normal angezeigt.

      An den texten arbeite ich jetz mal.

      btw. welcher ftp server ist der beste, schnellste und sicherste?

      ich benutze kilu mit dem FZ Clienten.

      Und noch etwas wüsste ich auch gerne,

      Ich will diese Page lieber mit contents versehen, so das ich nicht immer in jeder HTML-Datei etwas ändern muss.

      MFG



      Hab gesehen das ich ausversehen doppelpost gemacht habe.

      Kann ein Mod bitte den oberen beitrag löschen? danke.

    • [x]Akazuki;196122 schrieb:


      btw. welcher ftp server ist der beste, schnellste und sicherste?

      ich benutze kilu mit dem FZ Clienten.


      ich benutz auch kilu
      aber am schnellsten und besten is denk ich bplaced,
      da sie keine Werbung haben und doch relativ schnell sind,
      problem is bloß das sie sehr sehr schnell sind was account sperren angeht

    • BizZi;196125 schrieb:

      ich benutz auch kilu
      aber am schnellsten und besten is denk ich bplaced,
      da sie keine Werbung haben und doch relativ schnell sind,
      problem is bloß das sie sehr sehr schnell sind was account sperren angeht



      wieso sollten sie den acc sperren?

      bzw habe noch eine frage, extrern läuft die galleriepage perfekt.

      aber auf dem ftp server nicht.

      hier der quellcode.

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
      <html>
      <head>
      <meta http-equiv="Content-Type"
      content="text/html; charset=iso-8859-1">
      <meta name="robots" content="INDEX,FOLLOW">
      <meta name="keywords"
      content="">
      <meta name=""
      content="" >
      <title>S4 League</title>

      <link rel="stylesheet" href="menue.css" type="text/css">
      <link rel="stylesheet" href="format.css" type="text/css">
      <STYLE type="text/css">
      #imageSlideshowHolder{

      /* This is a CSS hack in order to get a nice look in IE 5.5 and lower

      In these versions of Internet Explorer, we need to add borders and padding to the width. In this example, we have a 3 pixel
      border on all sides. This means that the width in IE5.5 should be 606 pixels(600 + border 3px on the left + border 3 px on the right). Height
      should be set to 456 pixels(450 + 3 +3). IE 5.5 will ignore the width attributes below the first line. These will be applied to other browsers.

      */
      /* CSS HACK */
      width: 606px; /* IE 5.x */
      width/* */:/**/600px; /* Other browsers */
      width: /**/600px;

      /* CSS HACK */
      height: 456px; /* IE 5.x */
      height/* */:/**/450px; /* Other browsers */
      height: /**/450px;

      background-color:#000;
      border:3px solid #317082;
      position:relative; /* Never change this value */

      }
      .imageInGallery{
      width:600px;
      height:450px;
      background-color:#000;

      /* Never change these 3 value */
      left:0px;
      top:0px;
      position:absolute;
      }


      #imageSlideshowHolder img{
      position:absolute;
      }


      </style>
      <SCRIPT type="text/javascript">

      // You can modify these three values
      var slideshow2_noFading = false; // Just normal show/hide without fading ?
      var slideshow2_timeBetweenSlides = 1500; // Amount of time between each image(1000 = 1 second)
      var slideshow2_fadingSpeed = 20; // Speed of fading


      /* Don't change any of these values */
      var slideshow2_galleryHeigh; // Height of galery
      var slideshow2_galleryContainer; // Reference to the gallery div
      var slideshow2_galleryWidth; // Width of gallery
      var slideshow2_slideIndex = -1; // Index of current image shown
      var slideshow2_slideIndexNext = false; // Index of next image shown
      var slideshow2_imageDivs = new Array(); // Array of image divs(Created dynamically)
      var slideshow2_currentOpacity = 100; // Initial opacity
      var slideshow2_imagesInGallery = false; // Number of images in gallery

      function getGalleryImageSize(imageIndex)
      {
      if(imageIndex==slideshow2_imagesInGallery){
      showGallery();
      }else{
      var imgObj = document.getElementById('galleryImage' + imageIndex);
      var imgWidth = imgObj.width;
      var imgHeight = imgObj.height;
      if(imgWidth>50){
      var tmpDiv = document.createElement('DIV');
      tmpDiv.id = 'galleryDiv' + imageIndex;
      tmpDiv.style.visibility = 'hidden';
      tmpDiv.className='imageInGallery';
      slideshow2_galleryContainer.appendChild(tmpDiv);
      tmpDiv.appendChild(imgObj);
      imgObj.style.left = Math.round((slideshow2_galleryWidth - imgWidth)/2) + "px";
      imgObj.style.top = Math.round((slideshow2_galleryHeight - imgHeight)/2) + "px";
      tmpDiv.style.visibility = 'hidden';
      slideshow2_imageDivs.push(tmpDiv);
      imageIndex++;
      getGalleryImageSize(imageIndex);
      }else{
      setTimeout('getGalleryImageSize(' + imageIndex + ')',10);
      }
      }
      }

      function showGallery()
      {
      if(slideshow2_slideIndex==-1)slideshow2_slideIndex=0; else slideshow2_slideIndex++; // Index of next image to show
      if(slideshow2_slideIndex==slideshow2_imageDivs.length)slideshow2_slideIndex=0;
      slideshow2_slideIndexNext = slideshow2_slideIndex+1; // Index of the next next image
      if(slideshow2_slideIndexNext==slideshow2_imageDivs.length)slideshow2_slideIndexNext = 0;

      slideshow2_currentOpacity=100; // Reset current opacity

      // Displaying image divs
      slideshow2_imageDivs[slideshow2_slideIndex].style.visibility = 'visible';
      if(navigator.userAgent.indexOf('Opera')<0){
      slideshow2_imageDivs[slideshow2_slideIndexNext].style.visibility = 'visible';
      }


      if(document.all){ // IE rules
      slideshow2_imageDivs[slideshow2_slideIndex].style.filter = 'alpha(opacity=100)';
      slideshow2_imageDivs[slideshow2_slideIndexNext].style.filter = 'alpha(opacity=1)';
      }else{
      slideshow2_imageDivs[slideshow2_slideIndex].style.opacity = 0.99; // Can't use 1 and 0 because of screen flickering in FF
      slideshow2_imageDivs[slideshow2_slideIndexNext].style.opacity = 0.01;
      }


      setTimeout('revealImage()',slideshow2_timeBetweenSlides);
      }

      function revealImage()
      {
      if(slideshow2_noFading){
      slideshow2_imageDivs[slideshow2_slideIndex].style.visibility = 'hidden';
      showGallery();
      return;
      }
      slideshow2_currentOpacity--;
      if(document.all){
      slideshow2_imageDivs[slideshow2_slideIndex].style.filter = 'alpha(opacity='+slideshow2_currentOpacity+')';
      slideshow2_imageDivs[slideshow2_slideIndexNext].style.filter = 'alpha(opacity='+(100-slideshow2_currentOpacity)+')';
      }else{
      slideshow2_imageDivs[slideshow2_slideIndex].style.opacity = Math.max(0.01,slideshow2_currentOpacity/100); // Can't use 1 and 0 because of screen flickering in FF
      slideshow2_imageDivs[slideshow2_slideIndexNext].style.opacity = Math.min(0.99,(1 - (slideshow2_currentOpacity/100)));
      }
      if(slideshow2_currentOpacity>0){
      setTimeout('revealImage()',slideshow2_fadingSpeed);
      }else{
      slideshow2_imageDivs[slideshow2_slideIndex].style.visibility = 'hidden';
      showGallery();
      }
      }

      function initImageGallery()
      {
      slideshow2_galleryContainer = document.getElementById('imageSlideshowHolder');
      slideshow2_galleryWidth = slideshow2_galleryContainer.clientWidth;
      slideshow2_galleryHeight = slideshow2_galleryContainer.clientHeight;
      galleryImgArray = slideshow2_galleryContainer.getElementsByTagName('IMG');
      for(var no=0;no<galleryImgArray.length;no++){
      galleryImgArray[no].id = 'galleryImage' + no;
      }
      slideshow2_imagesInGallery = galleryImgArray.length;
      getGalleryImageSize(0);

      }

      </SCRIPT>


      </head>
      <body >

      <table id="main" align="center" cellspacing="0" cellpadding="0" border="0" >
      <tr>
      <td valign="top" width="100%" >

      <table align="center" width="100%" border="0" cellpadding="0" cellspacing="0" >

      <tr>
      <td id="leiste" >

      </tr>
      </table>


      </td>
      </tr>
      <tr>
      <td width="100%" >

      <table width="100%" border="0" cellpadding="0" cellspacing="0" >
      <tr>
      <td id="sp1" valign="top" >

      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/pixelspace.gif" width="300" height="1" border="0" alt=""><br>
      <div id="sp1zentriert"><img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/banner.png" width="300px"></div>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>




      <div id="menu1">

      <ul >
      <li id="aktuell"><a href="index.html" >Startseite</a></li>
      <li><a href="deathmatch.html" >Deathmatch</a></li>
      <li><a href="touchdown.html" >Touchdown</a></li>
      <li><a href="chaser.html" >Andere Mode's</a></li>
      <li><a href="waffen.html" >Waffen</a></li>
      <li><a href="skills.html" >Skills</a></li>
      <li><a href="level.html" >Level</a></li>
      <li><a href="gallerie.html" >Bilder-Gallerie</a></li>
      </ul>
      </div>
      <br>
      <br>
      <br>
      <br>


      <br>
      <br>
      <br>
      <br>


      </td>




      <td width="100%" valign="top" id="sp2" >

      <center> <h1>Bilder-Galerie</h1><br>
      <br>
      <div id="imageSlideshowHolder">
      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/gallerie/1.jpg" width="600px" height="450px" >
      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/gallerie/2.jpg" width="600px" height="450px">
      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/gallerie/3.jpg" width="600px" height="450px">
      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/gallerie/4.jpg" width="600px" height="450px">
      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/gallerie/5.jpg" width="600px" height="450px">
      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/gallerie/6.jpg" width="600px" height="450px">
      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/gallerie/7.jpg" width="600px" height="450px" >
      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/gallerie/8.jpg" width="600px" height="450px">
      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/gallerie/9.jpg" width="600px" height="450px">
      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/gallerie/10.jpg" width="600px" height="450px">
      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/gallerie/11.jpg" width="600px" height="450px">
      <img src="http://wp10556711.vwp5917.webpack.hosteurope.de/forum/images/gallerie/12.jpg" width="600px" height="450px">
      </div>
      <SCRIPT type="text/javascript">
      initImageGallery();
      </SCRIPT>



      </center>
      </td>


      </tr>

      </table>
      <table align="center" width="100%" border="0" cellpadding="0" cellspacing="0" >

      <tr>
      <td id="leisteunten" >S4 League Fanpage made by [x]Akazuki</td>
      </tr>
      </table>
      </td>
      </tr>
      </table>




      <table align="center" width="100%" border="0" cellpadding="0" cellspacing="0" >
      <tr>
      <td id="fussb" ><a href = "http://www.youtube.com/user/tanjustyler?feature=mhum">Mein Youtube Kanal</a></td>
      </tr>
      </table>







      </body>
      </html>




      edit:

      funzt alles.