JQUERY Scrollable

[TCOS]

Hallo

Ich bin absoluter Neulig und möchte gerne meine Herstellerlogos als jquery tool auf der Startseite (default.hmtl) darstellen.

Dies möchte ich einfügen:

http://flowplayer.org/tools/demos/scrollable/index.html

Kann mir jemand helfen bzw. sagen wo welche Datei ersetzt werden muss?

Wo die im Link stehenden Codes hinkommen?

Danke bereits im Vorraus

MFG

Michael

[tgoehl]

Möchtest du das jquery im Template mit einbauen, oder im Content deiner Seite?

Generell würde ich dir empfehlen einen komplett neuen Content für dein jquery zu erstellen. Packst du diesen java Code in deinen Starseiten Content mit rein, so kannst du diesen nur noch in deiner mysql Datenbank bearbeiten. Veyton bringt dir sonst Im Content Editor einen Fehler (die Erfahrung habe zumindest ich gemacht).

Der CSS Teil kommt in deine Template CSS.

Die *.js Dateien müssen in die javascript.php vom deinen Template.

[TCOS]

Hallo *g*

Ich möchte es im Content (index) mit einbauen.

Oh man - des wird was bis ich des check (

Könntest du mir eine genaue Anleitung geben?

Hoff ich nerv net ;(

[mzanier]

am einfachsten in die box_manufacturers.html integrieren.

dort stehen auch alle Hersteller zur Verfügung.

[TCOS]

So hab bis jetzt folgendes gemacht:

In die default.html folgende Sätze eingefügt:

<script src="http://cdn.jquerytools.org/1.2.3/jquery.tools.min.js"></script>

<script src="js/jquery.js"></script>

<script src="js/tabs.js"></script>

<script src="js/lightbox.js"></script>

<script src="js/another-plugin.js"></script>

Is das soweit richtig?

Kommt der html Code auch in die default?

In der Anleitung steht auch das dieses Demo mit zwei .css Dateien arbeitet.

Hab diese 2 in den Ordner /httpdocs/xtFramework/library/jquery kopiert.

CSS Code in die css.php datei in meinem Template?

Das JavaScript setup in die js.php?

Oh man, ich muss no sooooo viel lernen ;((

DANKE @ all die mir dabei helfen

Michael

[tgoehl]

Hi Michael,

ohne dir jetzt nahezutreten zu wollen. Probiere doch erst mal das ganze ohne Veyton auf deinen Webserver nachzubauen.

So versteht du dann die Logik des jquers Scripts ein bisschen mehr, und kannst das dann ggf. in deinen Veyton umsetzen.

Gruß

Tobi

[TCOS]

Hey Tobi

Ja du hast ja recht ;(

Hab mich jetzt a wengal gespielt und mich schlau gemacht wie das skript funktioniert.

So, jetzt steh ich total im Wald....

Folgendes hab ich gemacht und ich bekomme beim Aufruf meiner Seite nur einen weissen Bildschirm ;(

Hab die 2 .css Datein (scrollable-buttons und scrollable-horizontal) in den Ordner /httpdocs/xtFramework/library/jquery kopiert.

In der js. stehen nun diese Zeilen:

<script type="text/javascript" src="<?php echo _SYSTEM_BASE_URL . _SRV_WEB; ?>xtFramework/library/jquery/jquery-1.2.6.min.js"></script>


<script type="text/javascript" src="<?php echo _SYSTEM_BASE_URL . _SRV_WEB; ?>xtFramework/library/jquery/thickbox-compressed.js"></script>


<script src="http://cdn.jquerytools.org/1.2.3/full/jquery.tools.min.js"></script>[/PHP]

In die css.php hab ich die zwei neuen .css dateien mit eingefügt.

[PHP]<link rel="stylesheet" type="text/css" href="<?php echo _SYSTEM_BASE_URL . _SRV_WEB; ?>xtFramework/library/jquery/scrollable-buttons.css" />

<link rel="stylesheet" type="text/css" href="<?php echo _SYSTEM_BASE_URL . _SRV_WEB; ?>xtFramework/library/jquery/scrollable-horizontal.css" />[/PHP]

Auf der default.html hab ich den html code wie in http://flowplayer.org/tools/demos/scrollable/index.html beschrieben eingefügt.

Aber eines kapier ich nicht ;( Wo muss ich diese Zeile einfügen?

[PHP]<script>
// execute your scripts when the DOM is ready. this is mostly a good habit
$(function() {

// initialize scrollable
$(".scrollable").scrollable();

});
</script>[/PHP]

Steht die auch mit in der default?

So sieht im Moment meine default.html Seite aus:

[PHP]<script src="http://cdn.jquerytools.org/1.2.3/full/jquery.tools.min.js"></script>
{literal}
<!-- "previous page" action -->
<a class="prev browse left"></a>

<!-- root element for scrollable -->
<div class="scrollable">

<!-- root element for the items -->
<div class="items">

<!-- 1-5 -->
<div>
<img src="http://farm1.static.flickr.com/143/321464099_a7cfcb95cf_t.jpg" />
<img src="http://farm4.static.flickr.com/3089/2796719087_c3ee89a730_t.jpg" />
<img src="http://farm1.static.flickr.com/79/244441862_08ec9b6b49_t.jpg" />
<img src="http://farm1.static.flickr.com/28/66523124_b468cf4978_t.jpg" />
<img src="http://farm1.static.flickr.com/164/399223606_b875ddf797_t.jpg" />
</div>

<!-- 5-10 -->
<div>
<img src="http://farm1.static.flickr.com/163/399223609_db47d35b7c_t.jpg" />
<img src="http://farm1.static.flickr.com/135/321464104_c010dbf34c_t.jpg" />
<img src="http://farm1.static.flickr.com/40/117346184_9760f3aabc_t.jpg" />
<img src="http://farm1.static.flickr.com/153/399232237_6928a527c1_t.jpg" />
<img src="http://farm1.static.flickr.com/50/117346182_1fded507fa_t.jpg" />
</div>

<!-- 10-15 -->
<div>
<img src="http://farm4.static.flickr.com/3629/3323896446_3b87a8bf75_t.jpg" />
<img src="http://farm4.static.flickr.com/3023/3323897466_e61624f6de_t.jpg" />
<img src="http://farm4.static.flickr.com/3650/3323058611_d35c894fab_t.jpg" />
<img src="http://farm4.static.flickr.com/3635/3323893254_3183671257_t.jpg" />
<img src="http://farm4.static.flickr.com/3624/3323893148_8318838fbd_t.jpg" />
</div>

</div>

</div>

<!-- "next page" action -->
<a class="next browse right"></a>
<script>
// execute your scripts when the DOM is ready. this is mostly a good habit
$(function() {

// initialize scrollable
$(".scrollable").scrollable();

});
</script>
{/literal}[/PHP]

Sry Jungs wenn ich als Newbie so (in euren Augen) scheiss Fragen stelle ;((

MFG

Michael

[tgoehl]

Wie gestern schon in der PN geschrieben schaffe ich es Zeitlich nicht eine Detaillierte Anleitung zu schreiben.

Hast du denn schon mal das Script als stand alone auf deinen Server zum Laufen bekommen?

Wie ist denn die URL von deinen Shop, dann kann ich dir ggf. sagen was du noch ändern musst.