SELFPHP: Version 5.8.2 Befehlsreferenz - Tutorial – Kochbuch – Forum für PHP Einsteiger und professionelle Entwickler

SELFPHP
Professional CronJob-Service
Startseite
Aktuelles
SELFPHP
shopware Partner
SELFPHP Dokumentation
Premium-Partner
Anbieterverzeichnis
CronJob-Service
Services
Produktempfehlung
Internet Security

Suche



CronJob-Service    
bei SELFPHP mit ...


 + minütlichen Aufrufen
 + eigenem Crontab Eintrag
 + unbegrenzten CronJobs
 + Statistiken
 + Beispielaufrufen
 + Control-Bereich
Führen Sie mit den CronJobs von SELFPHP zeitgesteuert Programme auf Ihrem Server aus. Weitere Infos

:: Buchempfehlung ::

Websites optimieren für Google & Co.

Websites optimieren für Google & Co. zur Buchempfehlung
 

:: Anbieterverzeichnis ::

Globale Branchen

Informieren Sie sich über ausgewählte Unternehmen im Anbieterverzeichnis von SELFPHP  

 

:: Newsletter ::

Abonnieren Sie hier den kostenlosen SELFPHP Newsletter!

Vorname: 
Name:
E-Mail:
 
 

Zurück   PHP Forum > HTML, CSS und JavaScript Help!
Seite neu laden Linkgrafik mit jquery wechseln
Hilfe Community Kalender Heutige Beiträge Suchen

HTML, CSS und JavaScript Help! Hier gibt es Hilfe zu HTML, CSS und JavaScript Problemen

Antwort
 
Themen-Optionen Ansicht
  #1  
Alt 27.12.2011, 16:30:23
Benutzerbild von juergen
juergen juergen ist offline
Junior Member
  
Registriert seit: Nov 2004
Ort: Schmitten
Alter: 66
Beiträge: 318
Linkgrafik mit jquery wechseln
Hallo Forum,
ich habe eine Frage zu jquery.
Ich habe folgenden Code und öffne mit klick auf den Link den jeweiligen DIV-Container.
Das funktioniert sehr gut und genau so wie es ist soll es auch bleiben.

Jetzt möchte ich aber beim öffnen des Containers auch die kleine Grafik wechseln.
Und genau das bekomme ich nicht hin. Es soll so sein das beim geschlossenem Container immer das down.gif zu sehen ist. Beim geöffnetem Container das on.gif.

Ich bin für jede Hilfe Dankbar.

Mein Code:
HTML-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

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

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>


<title>Test</title>
<script type="text/javascript">


jQuery.fn.slideFadeToggle = function(speed, easing, callback) {
  return this.animate({opacity: 'toggle', height: 'toggle'}, speed, easing, callback);
};


$(document).ready(function(){
    $('.unsichtbar div').hide();


    $("#link1").click(function () {
     $("#div2").slideUp("slow", function() {
      $("#div3").slideUp("slow", function() {
       $("#div4").slideUp("slow", function() {
        $("#div5").slideUp("slow", function() {

         $('#div1').slideFadeToggle({speed:600, easing : "swing"});

          });
       });
      });    
     });
    });   
    
    $("#link2").click(function () {
     $("#div1").slideUp("slow", function() {
      $("#div3").slideUp("slow", function() {
       $("#div4").slideUp("slow", function() {
        $("#div5").slideUp("slow", function() {

         $('#div2').slideFadeToggle({speed:600, easing : "swing"});

          });
       });
      });    
     });
    });   
    
    $("#link3").click(function () {
     $("#div1").slideUp("slow", function() {
      $("#div2").slideUp("slow", function() {
       $("#div4").slideUp("slow", function() {
        $("#div5").slideUp("slow", function() {

         $("#div3").slideFadeToggle({speed:600, easing : "swing"});

          });
       });
      });    
     });
    });   
    
    $("#link4").click(function () {
     $("#div1").slideUp("slow", function() {
      $("#div2").slideUp("slow", function() {
       $("#div3").slideUp("slow", function() {
        $("#div5").slideUp("slow", function() {

         $("#div4").slideFadeToggle({speed:600, easing : "swing"});

          });
       });
      });    
     });
    });   
    
    $("#link5").click(function () {
     $("#div1").slideUp("slow", function() {
      $("#div2").slideUp("slow", function() {
       $("#div3").slideUp("slow", function() {
        $("#div4").slideUp("slow", function() {

         $("#div5").slideFadeToggle({speed:600, easing : "swing"});

          });
       });
      });    
     });
    });
 });
</script>




<style type="text/css">
.unsichtbar {
 display:none; opacity:0;
}
#div1 {
    background-color: #00FFFF;
}
#div2 {
    background-color: #00FF00;
}
#div3 {
    background-color: #FFFF00;
}
#div4 {
    background-color: #FF00FF;
}
#div5 {
    background-color: #FF0000;
}
</style>

</head>

<body>

<p>
<a id="link1" href="#"><img src="down.gif" border="0"> 1</a> &nbsp;|&nbsp;
<a id="link2" href="#"><img src="down.gif" border="0"> 2</a> &nbsp;|&nbsp;
<a id="link3" href="#"><img src="down.gif" border="0"> 3</a> &nbsp;|&nbsp; 
<a id="link4" href="#"><img src="down.gif" border="0"> 4</a> &nbsp;|&nbsp;
<a id="link5" href="#"><img src="down.gif" border="0"> 5</a>
</p>


<div class="unsichtbar" id="div1">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box1<br />
    -<br />
    -<br />
    -
</div>

<div class="unsichtbar" id="div2">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box2<br />
    -<br />
    -<br />
    -
</div>

<div class="unsichtbar" id="div3">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box3<br />
    -<br />
    -<br />
    -
</div>

<div class="unsichtbar" id="div4">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box4<br />
    -<br />
    -<br />
    -
</div>

<div class="unsichtbar" id="div5">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box5<br />
    -<br />
    -<br />
    -
</div>

</body>
</html>
__________________
--------------------------------
Gruß Jürgen

www.kenyasafaris.de
Mit Zitat antworten
  #2  
Alt 27.12.2011, 23:32:29
CPCoder CPCoder ist offline
Anfänger
  
Registriert seit: May 2008
Beiträge: 51
AW: Linkgrafik mit jquery wechseln
Also als erstes gibst du jedem <img>-Tag eine eindeutige ID.

Code:
<img id="i1" src="down.gif" border="0">
Nun packst in deine "click"-Funktionen eine Prüfung rein.

Code:
...
$("#link1").click(function () {
	// BEGINN DER PRÜFUNG
	var img = $('#i1').attr('src');
	if (img == 'down.gif') {
		$('#i1').attr('src', 'on.gif');
	} else {
		$('#i1').attr('src', 'down.gif');
	}
	// ENDE DER PRÜFUNG
	....
	// Dein bisheriger Code
}
Mit Zitat antworten
  #3  
Alt 28.12.2011, 07:47:48
Benutzerbild von juergen
juergen juergen ist offline
Junior Member
  
Registriert seit: Nov 2004
Ort: Schmitten
Alter: 66
Beiträge: 318
AW: Linkgrafik mit jquery wechseln
Hallo CPCoder,

super, danke das funktioniert. Allerdings musste ich noch was hinzufügen.
Wenn ich den Link 1 anklicke geht der DIV-1 auf und die Grafik wechselt.
Wenn ich den Link 2 anklick schließt der DIV-1 und es öffnet sich der DIV-2 und die Grafik wechselt sich auch aber die Grafik von DIV-1 wechselte nicht zurück.

Siehst Du eine Möglichkeit den Code etwas zu verkleinern bzw. allgemeiner zu gestallten?
Ich habe es jetzt so gemacht:
HTML-Code:
<script type="text/javascript">


jQuery.fn.slideFadeToggle = function(speed, easing, callback) {
  return this.animate({opacity: 'toggle', height: 'toggle'}, speed, easing, callback);
};


$(document).ready(function(){
    $('.unsichtbar div').hide();


    $("#link1").click(function () {
	var img = $('#i1').attr('src');
	if (img == 'down.gif') {
		$('#i1').attr('src', 'on.gif');
	} else {
		$('#i1').attr('src', 'down.gif);
	}

     $("#div2").slideUp("slow", function() {$('#i2').attr('src', 'down.gif');
      $("#div3").slideUp("slow", function() {$('#i3').attr('src', 'down.gif');
       $("#div4").slideUp("slow", function() {$('#i4').attr('src', 'down.gif');
        $("#div5").slideUp("slow", function() {$('#i5').attr('src', 'down.gif');

         $('#div1').slideFadeToggle({speed:600, easing : "swing"});

          });
       });
      });    
     });
    });   
    
    $("#link2").click(function () {
	var img = $('#i2').attr('src');
	if (img == 'down.gif') {
		$('#i2').attr('src', 'on.gif');
	} else {
		$('#i2').attr('src', 'down.gif');
	}

     $("#div1").slideUp("slow", function() {$('#i1').attr('src', 'down.gif');
      $("#div3").slideUp("slow", function() {$('#i3').attr('src', 'down.gif');
       $("#div4").slideUp("slow", function() {$('#i4').attr('src', 'down.gif');
        $("#div5").slideUp("slow", function() {$('#i5').attr('src', 'down.gif');

         $('#div2').slideFadeToggle({speed:600, easing : "swing"});

          });
       });
      });    
     });
    });   
    
    $("#link3").click(function () {
	var img = $('#i3').attr('src');
	if (img == 'down.gif') {
		$('#i3').attr('src', 'on.gif');
	} else {
		$('#i3').attr('src', 'down.gif');
	}

     $("#div1").slideUp("slow", function() {$('#i1').attr('src', 'down.gif');
      $("#div2").slideUp("slow", function() {$('#i2').attr('src', 'down.gif');
       $("#div4").slideUp("slow", function() {$('#i4').attr('src', 'down.gif');
        $("#div5").slideUp("slow", function() {$('#i5').attr('src', 'down.gif');

         $("#div3").slideFadeToggle({speed:600, easing : "swing"});

          });
       });
      });    
     });
    });   
    
    $("#link4").click(function () {
	var img = $('#i4').attr('src');
	if (img == 'down.gif') {
		$('#i4').attr('src', 'on.gif');
	} else {
		$('#i4').attr('src', 'down.gif');
	}

     $("#div1").slideUp("slow", function() {$('#i1').attr('src', 'down.gif');
      $("#div2").slideUp("slow", function() {$('#i2').attr('src', 'down.gif');
       $("#div3").slideUp("slow", function() {$('#i3').attr('src', 'down.gif');
        $("#div5").slideUp("slow", function() {$('#i5').attr('src', 'down.gif');

         $("#div4").slideFadeToggle({speed:600, easing : "swing"});

          });
       });
      });    
     });
    });   
    
    $("#link5").click(function () {
	var img = $('#i5').attr('src');
	if (img == 'down.gif') {
		$('#i5').attr('src', 'on.gif');
	} else {
		$('#i5').attr('src', 'down.gif');
	}

     $("#div1").slideUp("slow", function() {$('#i1').attr('src', 'down.gif');
      $("#div2").slideUp("slow", function() {$('#i2').attr('src', 'down.gif');
       $("#div3").slideUp("slow", function() {$('#i3').attr('src', 'down.gif');
        $("#div4").slideUp("slow", function() {$('#i4').attr('src', 'down.gif');

         $("#div5").slideFadeToggle({speed:600, easing : "swing"});

          });
       });
      });    
     });
    });
 });
</script>
__________________
--------------------------------
Gruß Jürgen

www.kenyasafaris.de
Mit Zitat antworten
  #4  
Alt 29.12.2011, 12:09:18
Ckaos Ckaos ist offline
Member
  
Registriert seit: Nov 2007
Beiträge: 843
AW: Linkgrafik mit jquery wechseln
Hi

@Juergen
Zu viel Code und nur mit wiederum viel Code erweiterbar!
Zitat:
Siehst Du eine Möglichkeit den Code etwas zu verkleinern bzw. allgemeiner zu gestallten?
unbedingt

@CPCoder
Zitat:
Also als erstes gibst du jedem <img>-Tag eine eindeutige ID.
Wenn jedes img den selben Wechsel macht völlig unnötig.

Bsp (ungetestet!)
jQuery
Code:
$(function(){
	$(".animateme").hide();
	$("[class*='toggleme']").toggle(function () {
			$(".animateme").hide();
			$(".toggleme > img").attr("src","down.gif");
			$("." + this.id).show();
			$("#" + this.id + "> img").attr("src","on.gif");
		}, function () {
			$("." + this.id).hide();
			$("#" + this.id).attr("src","down.gif");
		});
 });
Html
Code:
<a id="link1" class="toggleme" href="#"><img src="down.gif" border="0"> 1</a>
<div class="link1 animateme" id="div1">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box1<br />
    -<br />
    -<br />
    -
</div>
Vielleicht bringt dich das auf ideen ;)

mfg

CKaos
__________________
"Wenn die Leute Häuser so bauen würden, wie wir Programme schreiben, würde der erstbeste Specht unsere Zivilisation zerhacken."
In den allermeisten Fällen sitzt der Bug etwa 40 cm vor dem Monitor!
Mit Zitat antworten
  #5  
Alt 29.12.2011, 19:02:01
Benutzerbild von juergen
juergen juergen ist offline
Junior Member
  
Registriert seit: Nov 2004
Ort: Schmitten
Alter: 66
Beiträge: 318
AW: Linkgrafik mit jquery wechseln
Hallo Ckaos,

ich habe den ganzen Tag gegoogelt und was gutes gefunden.
Ich denke das passt jetzt. Ist sogar mit Hover.

HTML-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

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

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>


<title>Test</title>
<script type="text/javascript">

jQuery.fn.slideFadeToggle = function(speed, easing, callback) {
  return this.animate({opacity: 'toggle', height: 'toggle'}, speed, easing, callback);
};

$(document).ready(function(){

    var theDivs = $("#block-1-content, #block-2-content, #block-3-content, #block-4-content, #block-5-content");
    var theImgs = $("#block-1-img, #block-2-img, #block-3-img, #block-4-img, #block-5-img");

    $("a.toggler").click(function() {  	
       $( "#" + $(this).attr("id") + "-content" ).slideFadeToggle({speed:500, easing : "swing"});


             if ($( "#" + $(this).attr("id") + "-img").attr('src') == 'down.gif') {	
                          $( "#" + $(this).attr("id") + "-img" ).attr('src', 'on.gif');
                      } else {  
                          $( "#" + $(this).attr("id") + "-img" ).attr('src', 'down.gif');
             theImgs.not( $( "#" + $(this).attr("id") + "-img" ) ).attr('src', 'down.gif');
                      }  
      
        theDivs.not( $( "#" + $(this).attr("id") + "-content" ) ).slideUp("slow");        
    });

    $("a.toggler").hover(function() {
             if ($( "#" + $(this).attr("id") + "-img").attr('src') == 'down.gif') {	
                          $( "#" + $(this).attr("id") + "-img" ).attr('src', 'on.gif');
                      } else {  
                          $( "#" + $(this).attr("id") + "-img" ).attr('src', 'down.gif');
             theImgs.not( $( "#" + $(this).attr("id") + "-img" ) ).attr('src', 'down.gif');
                      }       
    });
});
</script>




<style type="text/css">
a {border:0px;}
.unsichtbar {
 display:none;
}

#block-1-content {
    background-color: #00FFFF;
}
#block-2-content {
    background-color: #00FF00;
}
#block-3-content {
    background-color: #FFFF00;
}
#block-4-content {
    background-color: #FF00FF;
}
#block-5-content {
    background-color: #FF0000;
}
</style>

</head>

<body>

<div class="imgchanges">
<a id="block-1" class="toggler" href="#"><img id="block-1-img" src="down.gif" border="0"> Link1</a> | 
<a id="block-2" class="toggler" href="#"><img id="block-2-img" src="down.gif" border="0"> Link2</a> |
<a id="block-3" class="toggler" href="#"><img id="block-3-img" src="down.gif" border="0"> Link3</a> | 
<a id="block-4" class="toggler" href="#"><img id="block-4-img" src="down.gif" border="0"> Link4</a> |
<a id="block-5" class="toggler" href="#"><img id="block-5-img" src="down.gif" border="0"> Link5</a>
</div>

<br /><br />

<div class="unsichtbar" id="block-1-content">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box1<br />
    -<br />
    -<br />
    -
</div>

<div class="unsichtbar" id="block-2-content">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box2<br />
    -<br />
    -<br />
    -
</div>

<div class="unsichtbar" id="block-3-content">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box3<br />
    -<br />
    -<br />
    -
</div>

<div class="unsichtbar" id="block-4-content">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box4<br />
    -<br />
    -<br />
    -
</div>

<div class="unsichtbar" id="block-5-content">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box5<br />
    -<br />
    -<br />
    -
</div>

</body>

</html>
__________________
--------------------------------
Gruß Jürgen

www.kenyasafaris.de
Mit Zitat antworten
  #6  
Alt 29.12.2011, 20:54:59
CPCoder CPCoder ist offline
Anfänger
  
Registriert seit: May 2008
Beiträge: 51
AW: Linkgrafik mit jquery wechseln
Zitat:
Zitat von Ckaos Beitrag anzeigen
Hi

@CPCoder

Wenn jedes img den selben Wechsel macht völlig unnötig.

Bsp (ungetestet!)
jQuery
Code:
$(function(){
	$(".animateme").hide();
	$("[class*='toggleme']").toggle(function () {
			$(".animateme").hide();
			$(".toggleme > img").attr("src","down.gif");
			$("." + this.id).show();
			$("#" + this.id + "> img").attr("src","on.gif");
		}, function () {
			$("." + this.id).hide();
			$("#" + this.id).attr("src","down.gif");
		});
 });
Html
Code:
<a id="link1" class="toggleme" href="#"><img src="down.gif" border="0"> 1</a>
<div class="link1 animateme" id="div1">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box1<br />
    -<br />
    -<br />
    -
</div>
Vielleicht bringt dich das auf ideen ;)

mfg

CKaos
Nuja ich hatte jetzt mal nur auf den gegebenen Code hin erweitert.
Die Kurzfassung von dir ist natürlich um einiges besser und vor allem kleiner :o)
Mit Zitat antworten
  #7  
Alt 29.12.2011, 21:30:20
Ckaos Ckaos ist offline
Member
  
Registriert seit: Nov 2007
Beiträge: 843
AW: Linkgrafik mit jquery wechseln
Hi

Zitat:
ich habe den ganzen Tag gegoogelt und was gutes gefunden.
Hauptsache du verstehst auch was da passiert, nur kopieren ist sinnvoll.

Zitat:
Nuja ich hatte jetzt mal nur auf den gegebenen Code hin erweitert.
Macht auch meistens Sinn, nur wenn man sieht das er sein Ziel nur mit 10mal kopierten Blöcken erreicht sollte man hinweisen das es auch ums kürzen geht.

mfg

CKaos
__________________
"Wenn die Leute Häuser so bauen würden, wie wir Programme schreiben, würde der erstbeste Specht unsere Zivilisation zerhacken."
In den allermeisten Fällen sitzt der Bug etwa 40 cm vor dem Monitor!
Mit Zitat antworten
  #8  
Alt 30.12.2011, 16:04:36
Benutzerbild von juergen
juergen juergen ist offline
Junior Member
  
Registriert seit: Nov 2004
Ort: Schmitten
Alter: 66
Beiträge: 318
AW: Linkgrafik mit jquery wechseln
Hallo Ckaos,
hallo CPCoder,

da ich erst vor einigen Wochen mit jQuery angefangen habe bin ich jetzt natürlich noch nicht soweit das ich alles verstehe was im Code so steht. Dewegen hole ich mir ja in Foren Hilfe bzw. Anregungen. Mittlerweile kann ich aber sagen das ich schon begriffen habe um was es geht und wie ich Elemente aus jQuery benutzen und einbauen kann.

Aber ich muss ja nicht immer das Rad neu erfinden. Es gibt so viele Seiten bzw. Blogs im Web auf denen sehr schön erklärt wird wie ein Plugin bzw. Codeschnipsel angewendet werden kann. Dabei bin ich auf easing gestoßen.
Ich habe mir das Plugin mal genauer angeschaut viel gelesen probiert getestet und dann meinen Anforderungen angepasst.

Ich denke das ich schon weiß was da passiert bin aber immer noch am Anfang.
Jedenfalls habe ich noch einen Fehler entdeckt sodas es jetzt o.K. ist.

Noch mal vielen vielen Dank für Eure Hilfe. Gruß Jürgen
Hier noch mal die Lösung:
HTML-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

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

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>


<!--http://james.padolsey.com/demos/jquery/easing/-->

<script type="text/javascript" src="jquery.easing.1.3.js"></script>

<!--[if IE]><script type="text/javascript" src="excanvas.compiled.js"></script><![endif]-->


<title>Test</title>
<script type="text/javascript">

jQuery.fn.slideFadeToggle = function(speed, easing, callback) {
  return this.animate({opacity: 'toggle', height: 'toggle'}, speed, easing, callback);
};

$(document).ready(function(){

var theDivs = $("#block-1-content, #block-2-content, #block-3-content, #block-4-content, #block-5-content");
var theImgs = $("#block-1-img, #block-2-img, #block-3-img, #block-4-img, #block-5-img");

    $("a.toggler").click(function() {  	

$( "#" + $(this).attr("id") + "-content" ).slideFadeToggle({duration:1500, easing : "easeInOutQuint"});


             if ($( "#" + $(this).attr("id") + "-img").attr('src') == 'down.gif') {	
                          $( "#" + $(this).attr("id") + "-img" ).attr('src', 'on.gif');
                      } else {  
                          $( "#" + $(this).attr("id") + "-img" ).attr('src', 'down.gif');
             theImgs.not( $( "#" + $(this).attr("id") + "-img" ) ).attr('src', 'down.gif');
                      }  
      
theDivs.not( $( "#" + $(this).attr("id") + "-content" ) ).slideUp(750).fadeOut(750);       
    });

    $("a.toggler").hover(function() {
             if ($( "#" + $(this).attr("id") + "-img").attr('src') == 'down.gif') {	
                          $( "#" + $(this).attr("id") + "-img" ).attr('src', 'on.gif');
                      } else {  
                          $( "#" + $(this).attr("id") + "-img" ).attr('src', 'down.gif');
                      }       
    });
});
</script>




<style type="text/css">
a {border:0px;}
.unsichtbar {
 display:none;
}

#block-1-content {
    background-color: #00FFFF;
}
#block-2-content {
    background-color: #00FF00;
}
#block-3-content {
    background-color: #FFFF00;
}
#block-4-content {
    background-color: #FF00FF;
}
#block-5-content {
    background-color: #FF0000;
}
</style>

</head>

<body>

<div class="imgchanges">
<a id="block-1" class="toggler" href="#"><img id="block-1-img" src="down.gif" border="0"> Link1</a> | 
<a id="block-2" class="toggler" href="#"><img id="block-2-img" src="down.gif" border="0"> Link2</a> |
<a id="block-3" class="toggler" href="#"><img id="block-3-img" src="down.gif" border="0"> Link3</a> | 
<a id="block-4" class="toggler" href="#"><img id="block-4-img" src="down.gif" border="0"> Link4</a> |
<a id="block-5" class="toggler" href="#"><img id="block-5-img" src="down.gif" border="0"> Link5</a>
</div>

<br /><br />

<div class="unsichtbar" id="block-1-content">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box1<br />
    -<br />
    -<br />
    -
</div>

<div class="unsichtbar" id="block-2-content">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box2<br />
    -<br />
    -<br />
    -
</div>

<div class="unsichtbar" id="block-3-content">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box3<br />
    -<br />
    -<br />
    -
</div>

<div class="unsichtbar" id="block-4-content">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box4<br />
    -<br />
    -<br />
    -
</div>

<div class="unsichtbar" id="block-5-content">
    Hier steht was drin<br />
    -<br />
    -<br />
    --<br />
    -<br />
    Box5<br />
    -<br />
    -<br />
    -
</div>

</body>

</html>
__________________
--------------------------------
Gruß Jürgen

www.kenyasafaris.de
Mit Zitat antworten
Antwort

« Vorheriges Thema | Nächstes Thema »

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.
BB-Code ist an.
Smileys sind aus.
[IMG] Code ist aus.
HTML-Code ist aus.
Gehe zu

Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Add On für Dreamweaver CS5 JQuery Power Slider crn1 Off Topic Area 0 30.08.2011 15:49:19
CodeIgniter, ajax (jquery), Klasse laden McB_sser PHP Entwicklung und Softwaredesign 6 27.04.2010 07:23:40
Beliebigen Klick mit jQuery abfangen Foxxy HTML, CSS und JavaScript Help! 4 16.04.2009 19:16:34
Automatisches Wechseln von Bannern Mutated! PHP Grundlagen 38 12.05.2005 18:17:50
systemuser wechseln ingo PHP für Fortgeschrittene und Experten 1 18.12.2003 21:00:57


Alle Zeitangaben in WEZ +2. Es ist jetzt 23:39:45 Uhr.

SELFPHP - Archiv - Nach oben

Powered by vBulletin® Version 3.8.3 (Deutsch)
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.


© 2001-2024 E-Mail SELFPHP OHG, info@selfphp.de, Impressum, Kontakt