Slideshow in Shop 2

Freaky

Sehr aktives Mitglied
7. Mai 2009
1.331
104
Hallo,

ich möchte eine kleine Slideshow auf der Startseite in den Shop2 bauen. Dazu möchte ich jQuery benutzen. Das funktioniert auch so weit schon wie ich mir das vorstelle. Jetzt habe ich allerdings noch 2 Probleme.

Wenn der Besucher Javascript deaktiviert hat, werden alle Bilder untereinander angezeigt. Das sieht natürlich sehr blöd aus. Wie setze ich es um, dass dann ein Bild per Zufallsprinzip angezeigt wird?

Des weiteren, wie baue ich das Script am besten ein? Nutze ich nen iFrame oder binde ich das direkt ins Template ein?

Hier der Code:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

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

	<title>AnythingSlider</title>

	<link rel="stylesheet" href="css/page.css" type="text/css" media="screen" />
	<link rel="stylesheet" href="css/anythingslider.css" type="text/css" media="screen" />

	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
	<script type="text/javascript" src="js/jquery.easing.1.2.js"></script>
	<script type="text/javascript" src="js/swfobject.js"></script> <!-- http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js -->
	<script type="text/javascript" src="js/jquery.anythingslider.js" charset="utf-8"></script>

	<script type="text/javascript">

		$(function () {
			$('#slider1').anythingSlider({
				startPanel      : 0,         // This sets the initial panel
				autoPlay        : true, // This turns off the entire slideshow FUNCTIONALY, not just if it starts running or not
				startStopped    : false, // If autoPlay is on, this can force it to start stopped
				width           : 500,  // Override the default CSS width
				height          : 250,        // if resizeContent is false, this is the default height if panel size is not defined
//				toggleControls  : true, // if true, then slide in controls on hover and slider change, hide @ other times
				theme           : 'default',
				buildArrows     : false,      // If true, builds the forwards and backwards buttons

				onSlideComplete : function(slider){
					// alert('Welcome to Slide #' + slider.currentPage);
				}
			});



			// Report Events to console
			$('.anythingSlider').bind('slideshow_start slideshow_stop slideshow_paused slideshow_unpaused slide_init slide_begin slide_complete',function(e, slider){
				// show object ID + event (e.g. "slider1: slide_begin")
				var txt = slider.$el[0].id + ': ' + e.type + ', now on panel #' + slider.currentPage;
				$('#status').text(txt);
				if (window.console && window.console.firebug){ console.debug(txt); } // added window.console.firebug to make this work in Opera
			});



		});
	</script>
</head>
	<div id="">


			<!-- AnythingSlider #1 -->
			<ul id="slider1">

				<li><a href="http://xxxxx.de">
				<img src="images/slide-civil-1.jpg" width="500" height="250 alt="" /></li>

				<li><a href="http://xxxxx.de">
				<img src="images/slide-env-1.jpg" width="500" height="250 alt="" /></li>

				<li><a href="http://xxxxx.de">
				<img src="images/rahmen1.png" width="500" height="250 alt="" /></li>

				<li><a href="http://xxxxx.de">
				<img src="images/slide-civil-1.jpg" width="500" height="250 alt="" /></li>

				<li><a href="http://xxxxx.de">
				<img src="images/slide-env-1.jpg" width="500" height="250 alt="" /></li>

				<li><a href="http://xxxxx.de">
				<img src="images/slide-civil-2.jpg" width="500" height="250 alt="" /></li>



			</ul>  <!-- END AnythingSlider #1 -->



	</div>

</body>

</html>
 

Freaky

Sehr aktives Mitglied
7. Mai 2009
1.331
104
AW: Slideshow in Shop 2

Ich habe hier noch ein Problem.

Wenn ich in die tpl_inc/header.tpl folgenden Code einfüge:

Code:
    <link rel="stylesheet" href="{$currentTemplateDir}css/page.css" type="text/css" />
    <link rel="stylesheet" href="{$currentTemplateDir}css/anythingslider.css" type="text/css" />
    <script type="text/javascript" src="{$currentTemplateDir}js/jquery.anythingslider.js" charset="utf-8"></script>
Ist die ganze Formatierung vom Shop verloren. Habe ich da irgendwie nen Denkfehler drin?
 

Freaky

Sehr aktives Mitglied
7. Mai 2009
1.331
104
AW: Slideshow in Shop 2

Danke Jörg, aber die brauche ich ja. Zur Not benenne ich die halt um. Aber ne page.css verwendet der Shop ja eigentlich nicht. Da habe ich extra drauf geachtet.
 

Freaky

Sehr aktives Mitglied
7. Mai 2009
1.331
104
AW: Slideshow in Shop 2

Habe die Datei jetzt so umbenannt:

Code:
    <link rel="stylesheet" href="{$currentTemplateDir}css/anythingsliderhaupt.css" type="text/css" />
Aber sobald ich das einfüge, zerschießt mir die Formatierung. Verstehe ich nicht. Oder sind das die "Befehle" IN der besagten Datei, die sich mit dem Shop in die Quere kommen? Habe von CSS leider nicht wirklich viel Ahnung :redface:

EDIT:

Das ist der Inhalt der .css:

Code:
/* Demo specific css */
*                      { margin: 0; padding: 0; }
body                   { font: 12px Georgia, Serif; }
a, a img               { border: 0; text-decoration: none; }

#page-wrap             { width: 90%; padding: 15px; background: white; margin: 0 auto 50px; position: relative; }

h1                     { font: bold 60px Helvetica, Sans-Serif; letter-spacing: -2px; margin: 20px 0; text-align: center; }
h2                     { font: bold 30px Helvetica, Sans-Serif; letter-spacing: -1px; margin: 0 0 10px 0; }
h3                     { font: 20px Georgia, Serif; margin: 0 0 10px 0; }  
h5                     { font: 15px Georgia, Serif; text-align: center; }
pre                    { font: 13px/1.8 Monaco, MonoSpace; margin: 0 0 15px 0; background: #f5f5f5; block: inline; }
blockquote             { margin-left: 30px; }

ul                     { margin: 0 0 25px 25px; }
ul li                  { font: 15px Georgia, Serif; margin: 0 0 8px 0; }

#dl                    { position: absolute; top: 10px; right: 0; background: black; color: white; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 3px 6px; }
#dl:hover              { background: #666; }

.themeselector         { margin: 0 auto; text-align: center; }

#status                { color: #00a; font-weight: bold; }
.alert                 { color: #f00; font-weight: bold; }
.data                  { width: 100%; border: #555 1px solid; border-collapse: collapse; }
.data td, .data th     { border: #555 1px solid; padding: 0 5px; }
.data th               { background: #eee; }
.data .col             { width: 200px; }

/* For Specific Slides */
#textSlide             { padding: 10px 30px; }
#textSlide h3          { font: 20px Georgia, Serif; }
#textSlide h4          { text-transform: uppercase; font: 15px Georgia, Serif; margin: 10px 0; }
#textSlide ul          { list-style: disc; margin: 0 0 0 25px; }
#textSlide ul li       { display: list-item; }

.quoteSlide            { padding: 30px; }
.quoteSlide blockquote { font: italic 24px/1.5 Georgia, Serif; text-align: center; color: #444; margin: 0 0 10px 0; }
.quoteSlide p          { text-align: center; }

/* Set second slider panel sizes */
#slider2 .panel1       { width: 500px; height: 350px; }
#slider2 .panel2       { width: 450px; height: 420px; }
#slider2 .panel3       { width: 680px; height: 317px; }
#slider2 .panel4       { } /* left undefined to show it defaults to wrapper size */
#slider2 .panel5       { width: 680px; height: 317px; }
 

Dealux-GmbH

Sehr aktives Mitglied
5. März 2007
8.676
7
Düsseldorf
AW: Slideshow in Shop 2

Nimm mal nur das hier und lösch den Rest da raus:

HTML:
.themeselector         { margin: 0 auto; text-align: center; }

#status                { color: #00a; font-weight: bold; }
.alert                 { color: #f00; font-weight: bold; }
.data                  { width: 100%; border: #555 1px solid; border-collapse: collapse; }
.data td, .data th     { border: #555 1px solid; padding: 0 5px; }
.data th               { background: #eee; }
.data .col             { width: 200px; }

/* For Specific Slides */
#textSlide             { padding: 10px 30px; }
#textSlide h3          { font: 20px Georgia, Serif; }
#textSlide h4          { text-transform: uppercase; font: 15px Georgia, Serif; margin: 10px 0; }
#textSlide ul          { list-style: disc; margin: 0 0 0 25px; }
#textSlide ul li       { display: list-item; }

.quoteSlide            { padding: 30px; }
.quoteSlide blockquote { font: italic 24px/1.5 Georgia, Serif; text-align: center; color: #444; margin: 0 0 10px 0; }
.quoteSlide p          { text-align: center; }

/* Set second slider panel sizes */
#slider2 .panel1       { width: 500px; height: 350px; }
#slider2 .panel2       { width: 450px; height: 420px; }
#slider2 .panel3       { width: 680px; height: 317px; }
#slider2 .panel4       { } /* left undefined to show it defaults to wrapper size */
#slider2 .panel5       { width: 680px; height: 317px; }
 

Freaky

Sehr aktives Mitglied
7. Mai 2009
1.331
104
AW: Slideshow in Shop 2

Danke Jörg, das klappt soweit. Hast in ner Privatbrauerei was gut bei mir ;)

Jetzt habe ich nur noch ein Problem.
Den HTML Code habe ich jetzt über das Backend auf die Startseite eingebunden.
Kann ich das überhaupt machen?
Es wird nämlich leider nichts davon angezeigt, nur die Bilder der Slideshow in transparent. Drauf klicken kann ich allerdings.

Hier noch mal der eingefügte code:
Code:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

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

    <title>xxx</title>


    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript" src="{$currentTemplateDir}js/jquery.easing.1.2.js"></script>
    <script type="text/javascript" src="{$currentTemplateDir}js/swfobject.js"></script> <!-- http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js -->

    <script type="text/javascript">

        $(function () {
            $('#slider1').anythingSlider({
                startPanel      : 0,         // This sets the initial panel
                autoPlay        : true, // This turns off the entire slideshow FUNCTIONALY, not just if it starts running or not
                startStopped    : false, // If autoPlay is on, this can force it to start stopped
                width           : 500,  // Override the default CSS width
                height          : 250,        // if resizeContent is false, this is the default height if panel size is not defined
//                toggleControls  : true, // if true, then slide in controls on hover and slider change, hide @ other times
                theme           : 'default',
                buildArrows     : false,      // If true, builds the forwards and backwards buttons
                animationTime       : 800,       // How long the slideshow transition takes (in milliseconds)

                onSlideComplete : function(slider){
                    // alert('Welcome to Slide #' + slider.currentPage);
                }
            });



            // Report Events to console
            $('.anythingSlider').bind('slideshow_start slideshow_stop slideshow_paused slideshow_unpaused slide_init slide_begin slide_complete',function(e, slider){
                // show object ID + event (e.g. "slider1: slide_begin")
                var txt = slider.$el[0].id + ': ' + e.type + ', now on panel #' + slider.currentPage;
                $('#status').text(txt);
                if (window.console && window.console.firebug){ console.debug(txt); } // added window.console.firebug to make this work in Opera
            });



        });


window.onload = function() {
var imgs = document.getElementsByTagName("img");
for(var i=0; i<imgs.length; i++) {
    var image = imgs[i];
    if(image.className == "ausblenden") {
        image.style.display = "block";
    }
}
}
    </script>
</head>

    <div id="">


            <!-- AnythingSlider #1 -->
            <ul id="slider1" style="list-style-type:none;">

<!-- Dein erstes Bild -->
                <li><a href="http://www.xxxx.de/xxxx">
                <img src="{$currentTemplateDir}angebote/startseite1.png" width="500" height="250" alt="" /></li>

                <li><a href="http://www.xxxx">
                <img src="{$currentTemplateDir}angebote/startseite2.png" width="500" height="250" alt="" class="ausblenden" /></li>

                <li><a href="http://www.xxx">
                <img src="{$currentTemplateDir}angebote/startseite3.png" width="500" height="250" alt="" class="ausblenden" /></li>


            </ul>  <!-- END AnythingSlider #1 -->



    </div>

</body>

</html>
Aber wenn ich mir den fertigen Quellcode anzeigen lasse, ist es natürlich so, dass es einen Head Bereich gibt, einen Body Bereich und dann das selbe noch mal, von meinem Code natürlich.
 

Dealux-GmbH

Sehr aktives Mitglied
5. März 2007
8.676
7
Düsseldorf
AW: Slideshow in Shop 2

Hehe alles ;)

Nee das wird so nicht klappen. Das musst du schon ins Template einbinden. Kann ja keine zwei Head-Bereiche geben.

Das hier mit in die Header.tpl, bevor der Head-Bereich aufhört:

HTML:
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript" src="{$currentTemplateDir}js/jquery.easing.1.2.js"></script>
    <script type="text/javascript" src="{$currentTemplateDir}js/swfobject.js"></script> <!-- http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js -->

    <script type="text/javascript">

        $(function () {
            $('#slider1').anythingSlider({
                startPanel      : 0,         // This sets the initial panel
                autoPlay        : true, // This turns off the entire slideshow FUNCTIONALY, not just if it starts running or not
                startStopped    : false, // If autoPlay is on, this can force it to start stopped
                width           : 500,  // Override the default CSS width
                height          : 250,        // if resizeContent is false, this is the default height if panel size is not defined
//                toggleControls  : true, // if true, then slide in controls on hover and slider change, hide @ other times
                theme           : 'default',
                buildArrows     : false,      // If true, builds the forwards and backwards buttons
                animationTime       : 800,       // How long the slideshow transition takes (in milliseconds)

                onSlideComplete : function(slider){
                    // alert('Welcome to Slide #' + slider.currentPage);
                }
            });



            // Report Events to console
            $('.anythingSlider').bind('slideshow_start slideshow_stop slideshow_paused slideshow_unpaused slide_init slide_begin slide_complete',function(e, slider){
                // show object ID + event (e.g. "slider1: slide_begin")
                var txt = slider.$el[0].id + ': ' + e.type + ', now on panel #' + slider.currentPage;
                $('#status').text(txt);
                if (window.console && window.console.firebug){ console.debug(txt); } // added window.console.firebug to make this work in Opera
            });



        });


window.onload = function() {
var imgs = document.getElementsByTagName("img");
for(var i=0; i<imgs.length; i++) {
    var image = imgs[i];
    if(image.className == "ausblenden") {
        image.style.display = "block";
    }
}
}
    </script>

Und das hier dann in die Seite in die du das haben willst (z.B. Seite.tpl, aber Achtung, hier wird das auf allen Seiten die du über das Backend erstellst angezeigt!)

HTML:
    <div id="">


            <!-- AnythingSlider #1 -->
            <ul id="slider1" style="list-style-type:none;">

<!-- Dein erstes Bild -->
                <li><a href="http://www.xxxx.de/xxxx">
                <img src="{$currentTemplateDir}angebote/startseite1.png" width="500" height="250" alt="" /></li>

                <li><a href="http://www.xxxx">
                <img src="{$currentTemplateDir}angebote/startseite2.png" width="500" height="250" alt="" class="ausblenden" /></li>

                <li><a href="http://www.xxx">
                <img src="{$currentTemplateDir}angebote/startseite3.png" width="500" height="250" alt="" class="ausblenden" /></li>


            </ul>  <!-- END AnythingSlider #1 -->



    </div>
 

Freaky

Sehr aktives Mitglied
7. Mai 2009
1.331
104
AW: Slideshow in Shop 2

Ähm ja..
..wenn ich den oberen Code einfüge, bleibt die komplette Seite weiß.


Ich hatte mir das ganze Ding ja schon vorher zusammengebastelt und getestet, da lief es wunderbar. Ich wollte das erst über nen iframe einbinden, allerdings gibt es da ja noch das Problem, dass meinen Bilder verlinkt sind und diese dann wahrscheinlich die ganze Seite in dem iframe lädt. Getestet habe ich das allerdings noch nicht. Gibt es da nicht eine möglichkeit die index.html, oder wie man sie nennen mag, einfach so einzubinden? :redface:
 

Dealux-GmbH

Sehr aktives Mitglied
5. März 2007
8.676
7
Düsseldorf
AW: Slideshow in Shop 2

Im Shop3 könnte man das als Plugin machen.

Ich weiß aber glaube ich wo das problem ist. Versuche im Header mal folgendes:
HTML:
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript" src="{$currentTemplateDir}js/jquery.easing.1.2.js"></script>
    <script type="text/javascript" src="{$currentTemplateDir}js/swfobject.js"></script> <!-- http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js -->

   {literal} <script type="text/javascript">

        $(function () {
            $('#slider1').anythingSlider({
                startPanel      : 0,         // This sets the initial panel
                autoPlay        : true, // This turns off the entire slideshow FUNCTIONALY, not just if it starts running or not
                startStopped    : false, // If autoPlay is on, this can force it to start stopped
                width           : 500,  // Override the default CSS width
                height          : 250,        // if resizeContent is false, this is the default height if panel size is not defined
//                toggleControls  : true, // if true, then slide in controls on hover and slider change, hide @ other times
                theme           : 'default',
                buildArrows     : false,      // If true, builds the forwards and backwards buttons
                animationTime       : 800,       // How long the slideshow transition takes (in milliseconds)

                onSlideComplete : function(slider){
                    // alert('Welcome to Slide #' + slider.currentPage);
                }
            });



            // Report Events to console
            $('.anythingSlider').bind('slideshow_start slideshow_stop slideshow_paused slideshow_unpaused slide_init slide_begin slide_complete',function(e, slider){
                // show object ID + event (e.g. "slider1: slide_begin")
                var txt = slider.$el[0].id + ': ' + e.type + ', now on panel #' + slider.currentPage;
                $('#status').text(txt);
                if (window.console && window.console.firebug){ console.debug(txt); } // added window.console.firebug to make this work in Opera
            });



        });


window.onload = function() {
var imgs = document.getElementsByTagName("img");
for(var i=0; i<imgs.length; i++) {
    var image = imgs[i];
    if(image.className == "ausblenden") {
        image.style.display = "block";
    }
}
}
    </script>{/literal}
 

Freaky

Sehr aktives Mitglied
7. Mai 2009
1.331
104
AW: Slideshow in Shop 2

Wenn ich das einbinde, hat das schon mal keinen negativen Einfluss auf den Shop!
So wie ich es sehe, haste du nur die {literal} varriable eingebaut. Wozu ist das genau gut?

Wenn ich jetzt aus Post8 den zweiten Code im Backend auf der Startseite einbaue, bin ich wieder beim Ergebnis, dass die Slideshow nicht angezeigt wird die verlinkungen zu den Bildern aber vorhanden ist.
Muss ich den Code zwingend im Template einbinden? Das wäre ja dann am besten in der seite.tpl oder?
 

Dealux-GmbH

Sehr aktives Mitglied
5. März 2007
8.676
7
Düsseldorf
AW: Slideshow in Shop 2

Das {literal} verhindert das { oder } von Smarty in dem Bereich beachtet wird.

Stimmt, den zweiten Code könntest du eigentlich auch über das Backend einfügen. "Sollte" funktionieren.
 

Freaky

Sehr aktives Mitglied
7. Mai 2009
1.331
104
AW: Slideshow in Shop 2

So, wenn ich den Code in die seite.tpl einbinde, werden mir alle Grafiken korrekt angezeigt. Ich habe in meinem Beispiel drei Grafiken.
Leider wird die JS funktion nicht angesprochen, daher werden alle Bilder untereinander angezeigt.

Das Script erkennt auch ob JS aktiviert ist, wenn dies nämlich nicht der Fall ist, soll nur das erste Bild angezeigt werden. Das funktionierte aber alles. Also heißt es, irgendwie fehlt da der JS Zugriff.

Ich suche noch mal.
 

Dealux-GmbH

Sehr aktives Mitglied
5. März 2007
8.676
7
Düsseldorf
AW: Slideshow in Shop 2

Da war noch nen fehler drin. Die schließenden </a> haben gefehlt:

HTML:
    <div id="">


            <!-- AnythingSlider #1 -->
            <ul id="slider1" style="list-style-type:none;">

<!-- Dein erstes Bild -->
                <li><a href="http://www.xxxx.de/xxxx">
                <img src="{$currentTemplateDir}angebote/startseite1.png" width="500" height="250" alt="" /></a></li>

                <li><a href="http://www.xxxx">
                <img src="{$currentTemplateDir}angebote/startseite2.png" width="500" height="250" alt="" class="ausblenden" /></a></li>

                <li><a href="http://www.xxx">
                <img src="{$currentTemplateDir}angebote/startseite3.png" width="500" height="250" alt="" class="ausblenden" /></a></li>


            </ul>  <!-- END AnythingSlider #1 -->



    </div>
 

Freaky

Sehr aktives Mitglied
7. Mai 2009
1.331
104
AW: Slideshow in Shop 2

Also der will noch nicht auf JS zugreifen.

Die JS Dateien liegen alle im richtigen Verzeichnis, das habe ich jetzt 4x überprüft :biggrin:

Hier mal der Head-Bereich des GENERIERTEN Quellcodes:

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>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
    <title>Brettspielversand.de günstiger Gesellschaftsspiele Shop</title>
    <META NAME="Title" CONTENT="Brettspielversand.de günstiger Gesellschaftsspiele Shop">
    <META NAME="description" CONTENT="">
    <meta name="author" content="Christian Wirtz">
    <META NAME="language" CONTENT="de">
    <META NAME="revisit-after" CONTENT="7 days">
    <META NAME="robots" CONTENT="index, follow, all">
    <META NAME="publisher" CONTENT="xxx">
    <META NAME="copyright" CONTENT="xxx">
    <META NAME="keywords" CONTENT="xxx">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="expires" content="now">
    <meta http-equiv="Content-Language" content="de">
    <link rel="stylesheet" type="text/css" href="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/templates/IDR_smooth/css/jtlshop2.css"]templates/IDR_smooth/css/jtlshop2.css[/URL]">
    <link rel="stylesheet" href="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/templates/IDR_smooth/css/tab.css"]templates/IDR_smooth/css/tab.css[/URL]" TYPE="text/css" MEDIA="screen">
    <link rel="stylesheet" href="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/templates/IDR_smooth/css/tab-print.css"]templates/IDR_smooth/css/tab-print.css[/URL]" TYPE="text/css" MEDIA="print">
    <link rel="shortcut icon" href="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/templates/IDR_smooth/gfx/favicon.ico"]templates/IDR_smooth/gfx/favicon.ico[/URL]" />
    <link rel="stylesheet" href="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/templates/IDR_smooth/css/anythingsliderhaupt.css"]templates/IDR_smooth/css/anythingsliderhaupt.css[/URL]" type="text/css" />
    <link rel="stylesheet" href="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/templates/IDR_smooth/css/anythingslider.css"]templates/IDR_smooth/css/anythingslider.css[/URL]" type="text/css" />
    <script type="text/javascript" src="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/templates/IDR_smooth/js/jquery.anythingslider.js"]templates/IDR_smooth/js/jquery.anythingslider.js[/URL]" charset="utf-8"></script>




    <script type="text/javascript" src="[URL="http://forum.jtl-software.de/view-source:http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"]http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js[/URL]"></script>
    <script type="text/javascript" src="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/templates/IDR_smooth/js/jquery.easing.1.2.js"]templates/IDR_smooth/js/jquery.easing.1.2.js[/URL]"></script>
    <script type="text/javascript" src="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/templates/IDR_smooth/js/swfobject.js"]templates/IDR_smooth/js/swfobject.js[/URL]"></script> <!-- [URL]http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js[/URL] -->

    <script type="text/javascript">

        $(function () {
            $('#slider1').anythingSlider({
                startPanel      : 0,         // This sets the initial panel
                autoPlay        : true, // This turns off the entire slideshow FUNCTIONALY, not just if it starts running or not
                startStopped    : false, // If autoPlay is on, this can force it to start stopped
                width           : 500,  // Override the default CSS width
                height          : 250,        // if resizeContent is false, this is the default height if panel size is not defined
//                toggleControls  : true, // if true, then slide in controls on hover and slider change, hide @ other times
                theme           : 'default',
                buildArrows     : false,      // If true, builds the forwards and backwards buttons
                animationTime       : 800,       // How long the slideshow transition takes (in milliseconds)

                onSlideComplete : function(slider){
                    // alert('Welcome to Slide #' + slider.currentPage);
                }
            });



            // Report Events to console
            $('.anythingSlider').bind('slideshow_start slideshow_stop slideshow_paused slideshow_unpaused slide_init slide_begin slide_complete',function(e, slider){
                // show object ID + event (e.g. "slider1: slide_begin")
                var txt = slider.$el[0].id + ': ' + e.type + ', now on panel #' + slider.currentPage;
                $('#status').text(txt);
                if (window.console && window.console.firebug){ console.debug(txt); } // added window.console.firebug to make this work in Opera
            });



        });


window.onload = function() {
var imgs = document.getElementsByTagName("img");
for(var i=0; i<imgs.length; i++) {
    var image = imgs[i];
    if(image.className == "ausblenden") {
        image.style.display = "block";
    }
}
}
    </script>



</head>
Und die betreffenden Zeilen weiter unten:

Code:
                <p class="navi">Sie sind hier: <a href="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/index.php?s=3"]index.php?s=3[/URL]">Startseite</a><br /></p>
        </div>

        <p class="spacer">&nbsp;</p>    <div id="wrapper">
        <div id="content">
            <div id="contentmid">





    <div id="">

            <!-- AnythingSlider #1 -->
            <ul id="slider1" style="list-style-type:none;">

<!-- Dein erstes Bild -->
                <a><a href="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/Sparsets"]http://www.xxx.de/xxx[/URL]">
                <img src="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/templates/IDR_smooth/angebote/startseite1.png"]templates/IDR_smooth/angebote/startseite1.png[/URL]" width="500" height="250" alt="" /></a></li>

                <a><a href="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/suche.php?suchausdruck=haus+anubis&JTLSHOP2"]http://www.xxx.de/[/URL]">
                <img src="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/templates/IDR_smooth/angebote/startseite2.png"]templates/IDR_smooth/angebote/startseite2.png[/URL]" width="500" height="250" alt="" class="ausblenden" /></a></li>
                <a><a href="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/Denk-und-Logikspiele"]http://www.xxx.de/[/URL]">
                <img src="[URL="http://forum.jtl-software.de/view-source:http://www.brettspielversand.de/templates/IDR_smooth/angebote/startseite3.png"]templates/IDR_smooth/angebote/startseite3.png[/URL]" width="500" height="250" alt="" class="ausblenden" /></a></li>


            </ul>  <!-- END AnythingSlider #1 -->



    </div>




                <div class="seite">
 

Freaky

Sehr aktives Mitglied
7. Mai 2009
1.331
104
AW: Slideshow in Shop 2

Funktioniert innerhalb des {literal} eventuell kein JS?

Mit nem iFrame habe ich es jetzt auch probiert, da scrollen die Bilder zwar durch, nur fehlen mir dann die Bedienelemente. Desweiteren werden die Links im iFrame geladen, was natürlich nicht sein sollte.

Man muss da doch irgendwie JS zum laufen bekommen :confused:
 
Ähnliche Themen
Titel Forum Antworten Datum
Neu Template update nach Shop update auf Installation / Updates von JTL-Shop 0
Url vom Shop korrekt setzten (index.html) Einrichtung JTL-Shop5 16
Beantwortet Übersicht Artikel in welchem Shop aktiv? User helfen Usern - Fragen zu JTL-Wawi 4
Neu In Shop Artikel vorbestellen - zusätzliche Versandkosten? User helfen Usern - Fragen zu JTL-Wawi 4
Neu Shop-Update Einrichtung von JTL-Shop4 3
Neu JTL-Shop 5.6 - Aktuell 5.6.0 Releaseforum 0
Neu Plugin-Idee: Überkäufe Lieferantenbestände & Lieferzeiten (API/CSV/XML) in Shop & Wawi Plugins für JTL-Shop 2
Neu Download-Artikel mit dem Download-Modul anbieten JTL SHOP Plugins für JTL-Shop 5
Brandtexte pro Shop verschieden anzeigen lassen JTL-Wawi 1.10 0
Neu Die folgenden Dateien sind nicht identisch mit den Dateien der aktuellen Version von JTL-Shop. Allgemeine Fragen zu JTL-Shop 0
Kundenstammdaten: Wie erkenne ich in der Wawi, ob ein Shop-Kunde ein Kundenkonto angelegt hat? JTL-Wawi 1.9 2
Neu Auswahl im JTL Shop - keine Rechnung beilegen - wie in Wawi einlesen ? User helfen Usern - Fragen zu JTL-Wawi 6
Neu Was bedeutet das genau: Anzahl nötiger Bestellungen (Zahlungsart im Shop Backend) Allgemeine Fragen zu JTL-Shop 1
Neu Schlechte Shop Ladezeit - Google Pagespeed Allgemeine Fragen zu JTL-Shop 11
Neu Kunden mit registrierten Konto im Shop exportieren User helfen Usern - Fragen zu JTL-Wawi 2
Neu Shop wo Kunden selbst einen Artikel designen können? Smalltalk 3
Neu Ausstellungsstücke korrekt abbilden – nicht im Shop verkaufen, aber in Lagerbewertung sichtbar User helfen Usern - Fragen zu JTL-Wawi 5
Neu PromoBar-Portlet für JTL-Shop 5 – Aktionsleiste, Gutschein & Countdown Plugins für JTL-Shop 0
Neu Automatische Datenübernahme aus Wawi-HTML in den Shop verhindern Hallo zusammen, Allgemeine Fragen zu JTL-Shop 3
Neu Paypal Zahlung erfolgreich, Auftrag mit Status Neu im Shop und fehlt in WAWI JTL-Shop - Fehler und Bugs 4
Verbindungsfehler zwischen Wawi 1.10 Shop 5.5.3 JTL-Wawi 1.10 10
Online-Shop-Abgleich Insert Anwendung Konflikt JTL-Wawi 1.10 0
Shop wird mehrfach angezeigt JTL-Wawi 1.10 8
Neu JTL-Shop-Template Technik – optimiert für Performance & Conversion Templates für JTL-Shop 5
Neu GA4-Tracking für JTL-Shop 5 – sauberes E-Commerce & Kategoriepfade Plugins für JTL-Shop 0
Neu Steuereinstellungen - Shop vs. Wawi? User helfen Usern - Fragen zu JTL-Wawi 6
Neu Artikelseiten 500 HTTP Fehler PayPal Plugin 2.1.0 JTL Shop 5.4.0 Plugins für JTL-Shop 4
Neu Wechsel von Shop 5 zu Shopify? Shopify-Connector 24
Neu Shop 5 globale Variable die aus der Wawi gefüllt wird? Allgemeine Fragen zu JTL-Shop 0
Neu TIKTOK Shop-Rabatte auf Artikel Business Jungle 1
Neu Rechnungsnummer an JTL-Shop übertragen Technische Fragen zu Plugins und Templates 0
Neu Änderung der Kundengruppe kein Einfluss im Shop Allgemeine Fragen zu JTL-Shop 2
Neu 500 Error durch Paypal Plugin im B2B Shop Plugins für JTL-Shop 0
Neu Nachdem Shop-Update auf 5.5.3, im Backend: Export-Manager nicht aufrufbar Installation / Updates von JTL-Shop 1
Neu Kundenübernahme Shopware zu JTL Shop - Länderzuweisung User helfen Usern - Fragen zu JTL-Wawi 1
Kunden im JTL Shop sichtbar ? Einrichtung JTL-Shop5 7
Neu CSS-Gutschein-Plugin funktioniert nach Shop-update auf 5.5.3 nicht mehr Plugins für JTL-Shop 1
Neu Agentur Empfehlungen Shop & WaWi Betreuung Allgemeine Fragen zu JTL-Shop 0
Neu Update auf Shop 5.5.3: Immer 500 Internal Server ERror JTL-Shop - Fehler und Bugs 1
Neu Im Shop-Backend (5.5.3) erhalte ich bei einigen Menüpunkten "HTTP 500 Error" Seiten Allgemeine Fragen zu JTL-Shop 2
Neu JTL Shop 5: ein Kundenkonto in der WAWI mit mehreren Konten im Webshop Allgemeine Fragen zu JTL-Shop 7
Neu Shop Logo vergrößern Templates für JTL-Shop 2
Shop Daten werden nicht mehr aktualisiert JTL-Wawi 1.9 2
Neu Alle Wawi Kunden im Shop registrieren User helfen Usern - Fragen zu JTL-Wawi 0
Neu PayPal V 2.0.2 mit Shop 5.5.2: Ablauf der Zahlung Plugins für JTL-Shop 13
wawi an shop anbinden geht nicht JTL-Wawi 1.10 2
Neu Ich habe eben einen neuen Shop erstellt und alle Artikel übertragen, aber leider werden mir bei den Versandarten die Versandklassen nicht angezeigt User helfen Usern - Fragen zu JTL-Wawi 1
Neu Hat jemand Erfahrung mit der Anbindung von TikTok Shop über Shopify? Einrichtung und Installation von JTL-eazyAuction 0
Neu Mehrere Connectoren aktiv – falscher Shopify-Shop wird verbunden Installation von JTL-Wawi 1
Neu ecomdata offline? Shop und JTL Wawi nicht erreichbar User helfen Usern - Fragen zu JTL-Wawi 16

Ähnliche Themen