mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: So 29.03.2020 20:06 Benutzername: Passwort: Auto-Login

Thema: Javascript wird vor dem laden der Seite ausgeführt vom 23.03.2013


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> Javascript wird vor dem laden der Seite ausgeführt
Seite: 1, 2, 3  Weiter
Autor Nachricht
elagil
Threadersteller

Dabei seit: 21.03.2012
Ort: -
Alter: -
Geschlecht: -
Verfasst Sa 23.03.2013 14:04
Titel

Javascript wird vor dem laden der Seite ausgeführt

Antworten mit Zitat Zum Seitenanfang

Hallo,

ich baue gerade eine Internetseite für meinen Vater, bin damit im Grunde fertig und habe nun ein Problem:
Online werden die Inhalte (Bilder in der Seitenleiste) zu langsam geladen, das jQuery-Script (custom scrollbars) wird zu früh geladen, so vermute ich, und es fehlen Bilder in besagter Leiste. Ein aktualisieren der Seite behebt das Problem, lokal tritt es auch nicht auf, wohl aber beim ersten Öffnen von der Onlineversion.

Das erste Bild der Seitenleiste existiert nicht, das ist kein Problem.
>> Link

Anbei die index.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>

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" href="favicon.ico" type="image/x-icon">

<!-- Laden der genutzten Schriftart -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300' rel='stylesheet' type='text/css'>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>Figueroa Design</title>
</head>



<body>
<div id="window">
<div id="followmouse"></div> <!-- ...folgt der maus immer -->


<div id="wrapper">

<div id="kontakt">figueroa-design[at]t-online.de</div>

<div id="impressum">
   <a href="">impressum</a>
</div>

<div id="top-bar">
   <div id="logo"><img src="images/logo.png" width="40" height="40"/></a></div>
    <div id="infos">figueroa . büro für gestaltung gmbh . 2012</div>

</div>

<div id="main">
<!-- Der weiße Hauptcontainer -->
<div class="cushycms" id="menu">
<!-- Div container mit scrollbaren Inhalten -->

         <div id="stuhlliste">
          <!-- Stühle -->
           
    <div anz="4" id="news" class="menu"><a href=""><img src="images/menu/news.jpg" alt="seminario" /></a></div>

  <!-- zahlreiche Inhalte, hier wurde gekürzt.. -->

    <div anz="5" id="wir" class="menu"><a href=""><img src="images/menu/wir.jpg" alt="wir" /></a></div>

         </div> <!-- Ende stuhlliste / Menü -->
           
</div> <!-- Ende menu -->
           
   
       <div id="laden" style="display:none">
      <div id="icon"><img src="images/menu/laden.gif"/></div>
        </div> <!-- Ende "laden" -->

      <div id="klickflaeche"><div id="hinweis"><img src="images/touch.png"/></div></div>
      
        <div id="ziel"><img src="images/stuhlbilder/1/0.jpg" id="start" width="100%" height="100%"/></div>
        <div id="textalt"></div>
       
       
       

</div> <!-- Ende main -->


</div> <!-- Ende wrapper -->
</div>

<!-- styles für jScrollPane -->
<link type="text/css" href="Scripts/scrollbalken_style.css" rel="stylesheet" media="all" />

<!-- styles allgemein -->
<link type="text/css" href="Scripts/styles_allgemein.css" rel="stylesheet" media="all" />

<!-- styles stühle/Positionierung im Menübalken -->
<link type="text/css" href="Scripts/styles_menu.css" rel="stylesheet" media="all" />

<!-- CSS style für den container "followmouse" der der maus...folgt. -->
<script type="text/javascript" src="Scripts/maus_folgen.js"></script>

<!-- jquery plugin laden -->
<script type="text/javascript" src="Scripts/jquery-bibliothek.js"></script>

<!-- mausrad plugin laden -->
<script type="text/javascript" src="Scripts/mausrad.js"></script>

<!-- jScrollPane plugin laden -->
<script type="text/javascript" src="Scripts/scrollbalken_script.js"></script>

<!-- Aktionen bei Klicks auf Menü und Container -->
<script type="text/javascript" src="Scripts/klickevents.js"></script>

<script type="text/javascript" src="Scripts/mobile_detect.js"></script>



<script type="text/javascript">
var wrapper_div = document.getElementById("wrapper"),
   main_div   = document.getElementById("main"),
   info_div   = document.getElementById("infos"),
   inner_width = window.innerWidth-30;
   
   if(inner_width<=1024) {
wrapper_div.style.width = inner_width + "px";
wrapper_div.style.height= (567*(inner_width-282)/756 + 100) + "px";

wrapper_div.style.marginLeft  = -(inner_width)/2 +"px";
wrapper_div.style.marginTop = -652*inner_width/2076 +"px";

info_div.style.width   = (inner_width-280) + "px";

main_div.style.width   = (inner_width-2) + "px";
main_div.style.height   = (567*(inner_width-280)/756) + "px";
}

</script>

<script type="text/javascript">$(document).ready(function () {$('#menu').jScrollPane()})</script>
</body>

</html>


Bei bedarf stelle ich auch gern die einzelnen Script-Codes rein, ich denke aber, dass das Problem irgendwo hier liegt.

Vielen Dank im Voraus
  View user's profile Private Nachricht senden
Morgo

Dabei seit: 10.08.2005
Ort: Von Kowelenz bis Kölle
Alter: 35
Geschlecht: Männlich
Verfasst Sa 23.03.2013 19:16
Titel

Antworten mit Zitat Zum Seitenanfang

Die simpelste Lösung wird wohl sein, bei den Bildern die Abmessungen mitzugeben.
  View user's profile Private Nachricht senden
Anzeige
Anzeige
elagil
Threadersteller

Dabei seit: 21.03.2012
Ort: -
Alter: -
Geschlecht: -
Verfasst Sa 23.03.2013 20:59
Titel

Antworten mit Zitat Zum Seitenanfang

die Bilder sind fast alle verschieden groß, ich hätte es gern so wenig statisch und leicht erweiterbar wie möglich (auch wenn es das im moment vermutlich nicht ist..).

An sich sollte doch javascript erst starten, wenn die seite komplett geladen ist..?
  View user's profile Private Nachricht senden
pantonine

Dabei seit: 03.03.2011
Ort: gehen Sie bitte weiter…
Alter: -
Geschlecht: -
Verfasst Sa 23.03.2013 21:06
Titel

Antworten mit Zitat Zum Seitenanfang

http://stackoverflow.com/questions/3698200/window-onload-vs-document-ready

Btw. ist es ungemein unclever, die beteiligten Scripte umzubenennen.

IMHO ist die Scrollbar auch kaum als solche zu erkennen, wenn man nicht weiß, dass da eine sein soll.


Zuletzt bearbeitet von pantonine am Sa 23.03.2013 21:07, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
elagil
Threadersteller

Dabei seit: 21.03.2012
Ort: -
Alter: -
Geschlecht: -
Verfasst So 24.03.2013 10:30
Titel

Antworten mit Zitat Zum Seitenanfang

Danke, das scheint so zu klappen:
Code:
<script type="text/javascript">window.onload = $('#menu').jScrollPane()</script>


Ich finde die Syntax sehr inkonsistent (schreibe eher C)... Warum schreibt man das hier anders (mit "=") als bei document.ready (ich weiß, das war vorher eine jQuery Funktion)

Zitat:
Btw. ist es ungemein unclever, die beteiligten Scripte umzubenennen.


Ok, das ändere ich wohl noch.

Zitat:
IMHO ist die Scrollbar auch kaum als solche zu erkennen, wenn man nicht weiß, dass da eine sein soll.


Sie soll nicht so aufdringlich sein *zwinker* Man kriegt schon raus wie die Seite funktioniert, hoffe ich Lächel


Zuletzt bearbeitet von Nimroy am So 24.03.2013 10:34, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
elagil
Threadersteller

Dabei seit: 21.03.2012
Ort: -
Alter: -
Geschlecht: -
Verfasst So 24.03.2013 11:03
Titel

Antworten mit Zitat Zum Seitenanfang

ich fand heraus, dass window.onload eine beschreibbare eigenschaft ist, damit bin ich zufrieden.
  View user's profile Private Nachricht senden
Frank Münschke
Forums-Papa

Dabei seit: 08.06.2006
Ort: Essen
Alter: 65
Geschlecht: Männlich
Verfasst So 24.03.2013 11:36
Titel

Antworten mit Zitat Zum Seitenanfang

Irgendwie kommt man aber von dem ausgewählten Sitzmöbel nicht zu den dazugehörigen weiteren Produktbildern rechts und dem entsprechenden Text oben. Bei mir auf dem iPad lande ich immer eins daneben ...
--
Hat dein alter Herr die Sachen entwickelt? Dann: "Chapeau!"
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
elagil
Threadersteller

Dabei seit: 21.03.2012
Ort: -
Alter: -
Geschlecht: -
Verfasst So 24.03.2013 12:44
Titel

Antworten mit Zitat Zum Seitenanfang

Zitat:
Bei mir auf dem iPad lande ich immer eins daneben ...


Nicht nur auf dem iPad *zwinker* Ich habe einen Produktordner versehentlich gelöscht, damit sind nach den ersten zwei/drei Stühlen alle folgenden um einen Ordner verschoben (wird gleich behoben)! Danke für den Hinweis Lächel

Mit der iPad Lösung bin ich aber allgemein eher unzufrieden. Ich muss wohl alles mit media queries neu bauen, von denen wusste ich aber nichts, als ich mit der seite angefangen habe (war eine art lernprojekt)..

Zitat:
Hat dein alter Herr die Sachen entwickelt? Dann: "Chapeau!"


Ja das hat er! Lächel


Zuletzt bearbeitet von elagil am So 24.03.2013 13:04, insgesamt 2-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen [javascript] bild nachladen ohne seite neu zu laden
JavaScript wird im IE nicht ausgeführt!
Seite will nicht laden
seite neu laden
javascript onload um div später zu laden
[dreamweaver] komplette seite laden
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2, 3  Weiter
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.