• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Frage Entwickelung, Darstellung im Internet Explorer, Edge,....

J

jan1996

Neues Mitglied
Hallo,

Bin langsam verzweifeln. Ich bastele gerade einer Website für einen Verein, die mir in Chrome, Safari, FireFox, so angezeigt wird, ich es will.
Aber: An meinem Rechner zuhause zeigen Internet explorer und Edge teileweise keine keine Bilder an, oder führen keine java-scripts aus oder übernehmen teilweise keine css-text-foramtierungen

Auf meinem Laptop widerum stellen IE und Edge die Website korrekt da.

habe das ganze mal auf der Arbeit ausprobiert, da zeigen IE und Edge die gleichen Probleme wie zuhause.

Woran kann das liegen?

Gruß

Jan
 
Ohne die Seite zu kennen wird es schwer dir zu helfen.
Im IE JavaScript deaktiviert? Unsauberer HTML-Code?
 
Java script ist aktiviert.

Ich habe den Html Quellcode mal reduziert und und annonymisiert, vllt. fällt dir was auf. Fehler bitte ich zu entschuldigen, da ich kein profi bin ;) Aber auch in der reduzierten können IE und Edge keine Bilder und Java-Scripts darstellen. Selbst die 2 Bilder im Header werden nicht einmal angezeigt.
Auf dem Laptop klappt es aber allerdings.


HTML: 
<!doctype html>
<html lang="de">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="robots" content="all,index,follow" />
    <meta name="description" content="xxxxxxxxxxxxxxxxxxxxxxx">   
    <title>xxxxxxxxxxxxxxxxxxxxxx</title>
    <meta name="author" content="xxxxxxxxxxxxxxxxxxxxxxx">
   <meta name="publisher" content="xxxxxxxxxxxxl">
   <link rel="shortcut icon" type="image/x-icon" href="Bilder/favicon.png">
    
    <script src="JS/jquery-3.2.1.min.js"></script>
    <script src="JS/responsiveslides.js"></script>
    <script src="JS/source.js"></script>
    <link rel="stylesheet" type="text/css"  href="css/style.css" />

</head>

<body>

<section id="screen1">

<nav>
        <ul>
            <li><a href="#screen1">Home</a></li>
            <li><a href="#screen2">Aktuelles</a></li>
            <li><a href="#screen3">Mitglieder</a></li>
            <li><a href="#screen4">Download</a></li>
            <li><a href="#screen5">Kontakt</a></li>
            <li id="iztext"><p>xxxxxxxxxxxxxx</p></li>
        </ul>
</nav>
    
<div id="header">
        <img id="izlogo" src="Bilder/xxxxxxx.jpg"  alt="xxxxxxxx">
        <img id="cllogo" src="Bilder/xxxxxxxx.jpg"   alt="xxxxxxxxxxx">
</div>
        
        
        
        
<div id="article">

<!-- Die Bilder hier werden nacheinander mit Javascript ein und ausgeblendet, es entsteht eine "Slide-Show" -->
  <ul class="rslides">              
    <li><img src="Bilder/rslide/1.jpg" alt=""></li>   
    <li><img src="Bilder/rslide/2.jpg" alt=""></li>     
    <li><img src="Bilder/rslide/3.jpg" alt=""></li>
  </ul>

 <div id="text">

  <div id="text1">
    <p>xxxxxxxxxxxxxxxxxxx</p>
  </div>

 </div>

 <div id="clusterme">
       <a href="xxxxxxxxxxxxxxxxxxxx" target="_blank" rel="noopener"><img src="Bilder/xxxxxxxxxx.jpg"></a>
 </div>

</div>

</section>
    
<section id="screen2">
</section>

<section id="screen3">
</section>

<section id="screen4">
</section>

<section id="screen5">
</section>

</body>

</html>
 
Hier:

Code: 
/* Allgemeine Einstellungen */

* {margin: 0; padding: 0;}

a {text-decoration: none;}

body {
    color: #fff;
    font-family: 'open-sans-bold';
    background-color:#2c42c1;
    position:relative;
}

@font-face {
    font-family: 'open-sans-bold';
    src: url('../fonts/open-sans/OpenSans-Bold.eot');
    src: url('../fonts/open-sans/OpenSans-Bold.eot?iefix') format('embedded-opentype'),
         url('../fonts/open-sans/OpenSans-Bold.ttf');
    font-weight: normal;
}   

/* Überschrift der Seiten */
#überschrift {
    width:100%;
    height:50px;
    background-color: #d60d5a;
}

#überschrift p{
text-align: center;
font-size: 25px;
padding-top:5px;
}


/* Screens Einstellungen */
#screen1 {   

  height:100vh;
  min-height: 800px;
  width: 100%;
 }

#screen2 {
    background: #efc94d;
    height: 94vh;
    min-height: 800px;
    width: 100%;
}

#screen3 {
    background:  #232f9b;
    height: 94vh;
    min-height: 800px;
    width: 100%;
}
#screen4{
    background:   #efc94d;
    height: 94vh;
    min-height: 800px;
    width: 100%;
}
#screen5 {
    background:  #232f9b;
    height: 94vh;
    min-height: 800px;
    width: 100%;
}





/* Screen1 Start */

#header{
    height: 100px;
    background-color: white;
}

/* Logos rechts und Links */
#izlogo{
    height:60px;
    float: left;
    margin-top:20px;
}
#cllogo{
    height:60px;
    float: right;
    margin-top:20px;
}

/* Navigationsleiste */
nav {
    position: absolute;
    top: 100px;
    width: 100%;
    margin:0;
    padding:0;
    text-align:center;
    height:6vh;
    z-index: 1;
}

nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

nav ul li {float: left;}

nav li a {
    display: table;
    color: white;
    text-align: center;
    padding: 2vh 18px;
    text-decoration: none;
    font-size: 18px;
}

nav li a:hover {background-color: #111;}

/* Nav fixeiert beim scrollen */
.fixed {
    position: fixed;
    top: 0px;
    }


/* Infotext links in der Nav-Bar */
#iztext {
      float: right;
      padding: 2vh 18px;
      letter-spacing:15px;
      font-size:20px;
    font-family:"arial";
}



#article{
    height: 100vh;
    min-height:800px;
    width: 100%;
    background-color: white;
    position:absolute;
    top:0px;
    z-index:-1;
}

#article img{
height:100%;
width:100%;
}

#text {
 position:absolute;
 bottom:0px;
left:0px;
height:350px;
width:100%;
z-index:2;
    background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 50%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(50%,rgba(255,255,255,1)));
    background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 50%);
    background: -o-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 50%);
    background: -ms-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 50%);
    background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 50%);
}

#text1 {
  position:relative;
  margin-left:auto;
  margin-right:auto;
  margin-top:80px;
  width:70%;
  min-width:800px;
  font-size: 18px;
  color: black;
  font-family: 'arial black';
}

/* Screen1 Ende */




/* Screen2 Start */
/* Screen2 Ende */

/* Screen3 Start */
/* Screen3 Ende */

/* Screen24Start */
/* Screen4 Ende */

/* Screen5 Start */
/* Screen5 Ende */




@media only screen and (max-width: 520px) {

    nav li {padding: 24px 4px;}
    nav li a {    font-size: 14px;}
}



@media only screen and (max-width: 1080px) {

#iztext { display: none;}
}






/* Bilderwechsel in Screen1 */
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }
.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }
.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }
.rslides img {
  display: block;
  height: 100vh;
  min-height: 800px;
  float: left;
  width: 100%;
  border: 0;
   object-fit: cover;
  }
 
also
Code: 
#überschrift p{
Was fäll dir da auf ?
Dann finde ich das (persönlich)
Code: 
    padding: 2vh 18px;
etwas doof,ich bleibe lieber bei einer größen Einheit anstatt die zu Mischen.
Aber das ist meine Meinung.Das kann man ja so machen wenn man will muss man aber nicht

Ansonsten kann ich jetzt nix finden.
Kucke aber gleich nochmal .
Achso wegen da oben "Ü"macht man nicht

Du hast in deiner CSS öfters margin und padding 0 stehen .
aber ganz am Anfang steht ja
Code: 
* {margin: 0; padding: 0;}

Deswegen brauchst du das nicht mehr andauern da rein schreiben.
Ich hoffe das stimmt was ich jetzt sage.
Bitte verbessert mich wenn ich falsch liege
 
Zuletzt bearbeitet:
Verbessert !!!
Ich glaube das es falsch ist was du sagst.
Ich meine es mal gelesen zu haben das es anders ist.
Du gibst am Anfang alle Elemente den Wert Margin und Padding 0.
Soweit richtig.
Wenn man aber jetzt einen <h1> erstellt ,greifft der Standart Wert von h1 was irgendwas von Padding 3px ist oder so .Dann bring der Anfangswert von 0 auch nix.
Ihr dürft mich aber auch verbessern
 
Nein, das ist falsch. Wenn man mit

Code: 
* { margin: 0;padding: 0; }

die Außen- und Innenabstände zurück setzt, dann gilt das für ALLE Elemente, egal wo sie im DOM angegeben sind. Ausnahme ist, wenn man für die konkreten Elemente die Eigenschaften überschreibt, z.B. so:

Code: 
* { margin: 0;padding: 0; }
h1 { padding: 42px; }
 
Ähm, @danielmuller und @basti1012, das ist doch der gleiche User, oder? Die gleichen Rechtschreibfehler, die merkwürdige Art Punkte und Kommatas zu setzen, das können doch unmöglich zwei Personen sein.
 
Habe mich lange nicht mehr gemeldet sorry,

Also ich habe die Problematik immernoch.

selbst bei sehr simplen Html-Code zeigt er lokale bilder nicht an. Weder Edge noch I-Net explorer.

HTML: 
<html>
<head>
<title>test123 </title>
</head>

<body>

<img src="a.jpg" alt="bild a">
<img  src="2.png" alt="bild 2">

<img src="https://upload.wikimedia.org/wikipedia/commons/f/f9/Phoenicopterus_ruber_in_S%C3%A3o_Paulo_Zoo.jpg">

</body>
</html>


Das letzte IMG mit der Online-ressource wird wiederum angezeigt ?!
Bei den anderen beiden erscheint nur der alt-tag.

Gruß


jan
 
Vorerst:
Ein img-Element muss immer einen alt-Attribut haben, auch bei online-Quellen.

jan1996 schrieb:
Bei den anderen beiden erscheint nur der alt-tag.
Zum Vergrößern anklicken....
Dann hast du die Pfadangabe definitiv nicht richtig gemacht oder deine Datei ist Fehlerhaft.
Der alt-Attribut erscheint sozusagen als Alternative, wenn die Quelle nicht angezeigt werden konnte (weil wegen Fehlern in der Datei oder Datei nicht gefunden).

Die Online-Quelle wird natürlich angezeigt, da der Pfad ja richtig ist.
Schau mal in die Entwicklerkonsole, da sollte sogar drinne stehen, ob ein Error 404 oder ein anderer Error vorliegt.

Edit:
jan1996 schrieb:
An meinem Rechner zuhause zeigen Internet explorer und Edge teileweise keine keine Bilder an, oder führen keine java-scripts aus oder übernehmen teilweise keine css-text-foramtierungen
Zum Vergrößern anklicken....
jan1996 schrieb:
Auf meinem Laptop widerum stellen IE und Edge die Website korrekt da.
Zum Vergrößern anklicken....
Das habe ich natürlich übersehen... man sollte sich schon den ganzen Thread durchlesen :rolleyes:.

Das kann natürlich daran liegen, dass evtl. der Cache nicht geleert wurde und eine ältere Version im Cache gespeichert ist, wo der Pfad noch anders ist o.ä.
jan1996 schrieb:
java-scripts aus oder übernehmen teilweise keine css-text-foramtierungen
Zum Vergrößern anklicken....
Das würde dafür sprechen.
 
Zuletzt bearbeitet:
ja also die bilder liegen im gleichen verzeichnis, wie die html datei. dann sind doch die Pfade korrekt angegeben oder?
Den Cache und habe ich auch gelöscht. Das Entwicklertoll im I-net-explorer sagt 0 Fehler, 0 Warnungen, 0 Meldungen.

Der code ist doch richtig so oder nicht?
 
Die I-net Entwicklerkonsole... ich habe es gerade mal getestet und die I-Net-Konsole zeigt mir auch keinen Fehler an, sobald die Fehler einen Error 404 oder so haben.
Versuch mal lieber die von Google Chrome und jag den Kram auch mal durch einen Validator. Chrome hat bei mir immer den richtigen Error bei meinen Tests ausgegeben.

Und schick bitte mal einen Link mit, der zur Online-Seite führt.

Die Pfadangabe ist eigentlich richtig...
Hast du mal geschaut, ob die Dateien vielleicht Fehlerhaft sind?
 
Hallo,

Habe jetzt nach langer Frust-Pause mich wieder an den PC gesetzt und bin der Lösung auf die Spur gekommen.

Ich habe den Quellcode immer mit dem CodeWriter von Windows10 geschrieben und gespeichert. Das scheint der Fehler gewesen zu sein.

Wenn ich nämlich 1 zu 1 den gleichen Quellcode in Dreamweaver, oder sogar in den Editor kopiere und speichere geht es komischer Weise auf anhieb und die Website lässt sich überall öffnen.

Werde jetzt einfach den Codewriter nicht mehr verwenden, anscheinend zerhackt er in irgd. einer weise die Datei so dass der Internetexplorer nicht mit klar kommt

Gruß

Jan
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben