Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag01.12.2009 um 18:12 (UTC)    
Titel: mehrere Javascripts auf einer Seite

Hi,

Ich habe ein Problem wo ich selber einfach nicht drauf kommen kann! Ich wollte mehrere Javascripts auf meiner Startseite:

1.) Videolightbox:

Code:

<link rel="stylesheet" href="http://lang4m3rzz.lima-city.de/unzip_videobox_1/unzip_videobox_1/video/css/videobox.css" type="text/css" />

<script type="text/javascript" src="http://lang4m3rzz.lima-city.de/unzip_videobox_1/unzip_videobox_1/video/js/mootools.js"></script>
<script type="text/javascript" src="http://lang4m3rzz.lima-city.de/unzip_videobox_1/unzip_videobox_1/video/js/swfobject.js"></script>
<script type="text/javascript" src="http://lang4m3rzz.lima-city.de/unzip_videobox_1/unzip_videobox_1/video/js/videobox.js"></script>
<div id="divid3">
<div class="Video">
<a href="http://www.youtube.com/watch?v=kAM_P08CjIE" rel="vidbox 853 505" title="Aion Vision Trailer"><img src="http://img.webme.com/pic/l/lan-g4m3rzz/trailer.png" alt="" /></a>


2. VisualLightBox

Code:

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
   <head>
      <meta http-equiv="content-type" content="text/html;charset=utf-8" />
      <link rel="shortcut icon" href="favicon.ico" />
      
      <!-- Start VisualLightBox.com HEAD section -->
      <link rel="stylesheet" href="engine/css/vlightbox.css" type="text/css" />
      <style>#vlightbox a#vlb{display:none}</style>
      
      <link rel="stylesheet" href="engine/css/visuallightbox.css" type="text/css" media="screen" />
      <script src="engine/js/jquery.min.js" type="text/javascript"></script>
      <!-- End VisualLightBox.com HEAD section -->
      
   </head>
   <body bgcolor=#ffffff >
   
   <!-- Start VisualLightBox.com BODY section -->
   </style> <script type="text/javascript">
function anzeigen(das) {
if (document.getElementById(das).style.display=='none') {
document.getElementById(das).style.display='block';
}
else {
document.getElementById(das).style.display='none';
}
}
</script>
   <div id="vlightbox">
<div id="seite1"><a href="javascript:anzeigen('seite9'); anzeigen('seite1');"><font size="6">«</font></a><a rel="lightbox_vlb" href="http://img.webme.com/pic/l/lan-g4m3rzz/dsc00548.jpg" title="call-of-duty-4"><img src="data/thumbnails/call-of-duty-4.png"><span></span></a><a href="javascript:anzeigen('seite1'); anzeigen('seite2');"><font size="6">»</font></a></div>

<div style="display: none;" id="seite2"><a href="javascript:anzeigen('seite1'); anzeigen('seite2');"><font size="6">«</font></a><a rel="lightbox_vlb" href="data/images/callofduty4wallpaper.jpg" title="callofduty4wallpaper"><img src="data/thumbnails/callofduty4wallpaper.png"><span></span></a><a href="javascript:anzeigen('seite2'); anzeigen('seite3');"><font size="6">»</font></a></div>

<div style="display: none;" id="seite3"><a href="javascript:anzeigen('seite2'); anzeigen('seite3');"><font size="6">«</font></a><a rel="lightbox_vlb" href="data/images/cod6.jpg" title="cod6"><img src="data/thumbnails/cod6.png"><span></span></a><a href="javascript:anzeigen('seite3'); anzeigen('seite4');"><font size="6">»</font></a></div>

<div style="display: none;" id="seite4"><a href="javascript:anzeigen('seite3'); anzeigen('seite4');"><font size="6">«</font></a><a rel="lightbox_vlb" href="data/images/cod6_bald.jpg" title="Cod6_bald"><img src="data/thumbnails/cod6_bald.png"><span></span></a></a><a href="javascript:anzeigen('seite4'); anzeigen('seite5');"><font size="6">»</font></a></div>

<div style="display: none;" id="seite5"><a href="javascript:anzeigen('seite4'); anzeigen('seite5');"><font size="6">«</font></a><a rel="lightbox_vlb" href="data/images/cod6_logo.jpg" title="cod6_logo"><img src="data/thumbnails/cod6_logo.png"><span></span></a></a><a href="javascript:anzeigen('seite5'); anzeigen('seite6');"><font size="6">»</font></a></div>

<div style="display: none;" id="seite6"><a href="javascript:anzeigen('seite5'); anzeigen('seite6');"><font size="6">«</font></a><a rel="lightbox_vlb" href="data/images/dota_loading.jpg" title="dota_loading"><img src="data/thumbnails/dota_loading.png"><span></span></a><a href="javascript:anzeigen('seite6'); anzeigen('seite7');"><font size="6">»</font></a></div>

<div style="display: none;" id="seite7"><a href="javascript:anzeigen('seite6'); anzeigen('seite7');"><font size="6">«</font></a><a rel="lightbox_vlb" href="data/images/gta-weazel-news.jpg" title="gta-weazel-news"><img src="data/thumbnails/gta-weazel-news.png"><span></span></a><a href="javascript:anzeigen('seite7'); anzeigen('seite8');"><font size="6">»</font></a></div>

<div style="display: none;" id="seite8"><a href="javascript:anzeigen('seite7'); anzeigen('seite8');"><font size="6">«</font></a><a rel="lightbox_vlb" href="data/images/smilie_pc_007.jpg" title="smilie_pc_007"><img src="data/thumbnails/smilie_pc_007.png"><span></span></a><a href="javascript:anzeigen('seite8'); anzeigen('seite9');"><font size="6">»</font></a></div>

<div style="display: none;" id="seite9"><a href="javascript:anzeigen('seite8'); anzeigen('seite9');"><font size="6">«</font></a><a rel="lightbox_vlb" href="data/images/wallpaper-modernwarfare2-1.jpg" title="wallpaper-modernwarfare2-1"><img src="data/thumbnails/wallpaper-modernwarfare2-1.png"><span></span></a><a href="javascript:anzeigen('seite9'); anzeigen('seite1');"><font size="6">»</font></a></div>

      <script src="engine/js/visuallightbox.js" type="text/javascript"></script>
   </div>
   <!-- End VisualLightBox.com BODY section -->
   
   </body>
</html>


Nun habe ich das Problem, dass die beiden Javascripts allein funktionieren aber zusammen nicht!
Ich habe ein bisschen gegoogelt und herausgefunden, dass sich 2 Javascripts auf einer Seite nicht funktionieren! Man muss irgentwas einfügen dann geht es.

Kennt jemand den Code?!

MfG Timo Wink

*Edit: Die Verlinkung zu den Bilder bitte nicht beachten! Muss ich noch verbessern, aber es müsste auch ohne Bilder funktionieren!

Auf meiner HP könnt ihr die 2 Scripts anschauen! Das Video funktioniert aber in der Box "Bilder" auf den Streifen drücken, das funktioniert nicht.


Zuletzt bearbeitet von lan-g4m3rzz am 01.12.2009, 19:14, insgesamt einmal bearbeitet
Beitrag02.12.2009 um 12:37 (UTC)    
Titel: javascript

Hallo

Es lassen sich durchaus mehrere Javascripts auf einer Seite verwenden (das mache ich auch andauernd). Wichtig ist nur, dass Elemente und Funktionen vorher im Code stehen, wenn spätere Funktionen auf sie zugreifen sollen.

Zu deinem 2. Code:

Ich bin zwar kein Experte in Sachen Javascript, aber um ein bestimmtes Element mit dem Skript zu beeinflussen, muss die Funktion auch darauf ausgelegt sein, mehrere Elemente benutzen zu können. Deine Funktion sucht momentan ein einzelnes Element, das "das" heißt, um etwas damit anzustellen. Dieses Element gibt es aber nicht.

Um ein und dieselbe Funktion für mehrere variable Elemente benutzen zu können, muss sie auf eine Element warten. Das sieht wie folgt aus:

Zitat:

function anzeigen(el) {
if (document.getElementById(el).style.display=='none') {
document.getElementById(el).style.display='block';
}
else {
document.getElementById(el).style.display='none';
}
}




Danach muss die id des gewünschten Elements aufgerufen werden, um die wartende Funktion zu starten. Das hast du aber schon richtig gemacht mit "javascript: anzeigen('seite9')". Fur das Skript ist hier die Klasse "seite9" das Element, mit dem die Funktion ausgeführt wird. Gibst du "seite8" ein, dann ist eben "seite8" das Element usw.

Ansonsten finde ich die Funktion ein wenig unlogisch, kann aber auch sein, dass ich mich irre.

Du definierst eine Klasse, die nicht angezeigt wird. Damit die Klasse angezeigt, wird, muss man jedoch auf sie klicken. Leider kann man keine Klasse anklicken, die nicht angezeigt wird, um sie anzeigen zu lassen. (Klingt jetzt vielleicht ein Bisschen wirr)

Eine Alternative währe es, eine Klasse zu definieren, die als Button fungiert, der angeklickt werden muss, um eine zuvor nicht sichtbare Klasse sichtbar zu machen. Ein Ansatz dafür sieht wie folgt aus:

Zitat:

<div id="irgendwas"><a href="javascript: anzeigen('irgendeine Seite')">Hier klicken!</a></div>




Vielleicht hilft dir das ein wenig.


Gruß

FK




also under => FKblack


Zuletzt bearbeitet von fkdesign am 02.12.2009, 19:22, insgesamt einmal bearbeitet
Beitrag02.12.2009 um 13:07 (UTC)    
Titel:

Hi,

Danke für die Antwort! Ich glaub ich verstehe was du meinst, aber wie soll ich das jetzt zusammensetzen?!

Auf meiner Homepage http://lan-g4m3rzz.de.tl/ ist unten ein video! Wenn man draufklickt stimmt alles! (1.Code) , aber wenn man in der rechten Box auf das Bild klickt, wird man einfach weitergeleitet! Eigentlich müsste eine selbe Box aufgehen wie beim Video. Selbst das Bildwechsel Javascript funktioniert nicht!

Könnt jemand anhand meines Codes zeigen wie es geht?!

Mein Code mit eingebundenen Bildern: (falls jemand das braucht)

Code:

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
   <head>
      <meta http-equiv="content-type" content="text/html;charset=utf-8" />
      <link rel="shortcut icon" href="favicon.ico" />
      
      <!-- Start VisualLightBox.com HEAD section -->
      <link rel="stylesheet" href="engine/css/vlightbox.css" type="text/css" />
      <style>#vlightbox a#vlb{display:none}</style>
      
      <link rel="stylesheet" href="engine/css/visuallightbox.css" type="text/css" media="screen" />
      <script src="engine/js/jquery.min.js" type="text/javascript"></script>
      <!-- End VisualLightBox.com HEAD section -->
      
   </head>
   <body bgcolor=#ffffff >
   
   <!-- Start VisualLightBox.com BODY section -->
   </style>
</script>
   <div id="vlightbox">
<div id="seite1"><a href="javascript:anzeigen('seite4'); anzeigen('seite1');"><font size="6">«</font></a><a rel="lightbox_vlb" href="http://img.webme.com/pic/l/lan-g4m3rzz/beispiel1.png" title="call-of-duty-4"><img src="http://img.webme.com/pic/l/lan-g4m3rzz/2beispiel1.png"><span></span></a><a href="javascript:anzeigen('seite1'); anzeigen('seite2');"><font size="6">»</font></a></div>

<div style="display: none;" id="seite2"><a href="javascript:anzeigen('seite1'); anzeigen('seite2');"><font size="6">«</font></a><a rel="lightbox_vlb" href="http://img.webme.com/pic/l/lan-g4m3rzz/beispiel2.png" title="callofduty4wallpaper"><img src="http://img.webme.com/pic/l/lan-g4m3rzz/2beispiel2.png"><span></span></a><a href="javascript:anzeigen('seite2'); anzeigen('seite3');"><font size="6">»</font></a></div>

<div style="display: none;" id="seite3"><a href="javascript:anzeigen('seite2'); anzeigen('seite3');"><font size="6">«</font></a><a rel="lightbox_vlb" href="http://img.webme.com/pic/l/lan-g4m3rzz/beispiel3.png" title="cod6"><img src="http://img.webme.com/pic/l/lan-g4m3rzz/2beispiel3.png"><span></span></a><a href="javascript:anzeigen('seite3'); anzeigen('seite4');"><font size="6">»</font></a></div>

<div style="display: none;" id="seite4"><a href="javascript:anzeigen('seite3'); anzeigen('seite4');"><font size="6">«</font></a><a rel="lightbox_vlb" href="http://img.webme.com/pic/l/lan-g4m3rzz/beispiel4.png" title="Cod6_bald"><img src="http://img.webme.com/pic/l/lan-g4m3rzz/2beispiel4.png"><span></span></a></a><a href="javascript:anzeigen('seite4'); anzeigen('seite1');"><font size="6">»</font></a></div>

      <script src="engine/js/visuallightbox.js" type="text/javascript"></script>
   </div>
   <!-- End VisualLightBox.com BODY section -->
   
   </body>
</html>


Die Codes habe ich nicht selbst geschrieben sondern aus dem Internet!

1.Code (Videolightbox): http://videobox-lb.sourceforge.net/

2.Code (Visuallightbox): http://visuallightbox.com/help.html

Falls jemand das braucht.

MfG


Zuletzt bearbeitet von lan-g4m3rzz am 02.12.2009, 14:43, insgesamt 2-mal bearbeitet
Beitrag03.12.2009 um 20:55 (UTC)    
Titel:

Hat keiner eine Idee?!

Wäre echt schade
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de