MODUL: Hersteller-Slider für die Startseite

[franky_n]

Hallo koshiro,

anbei die verbesserte Version.
War noch ein Fehler in der header.php, aber zumindest kommt im Quelltext ja schon mal was an

Code: PHP  [Auswählen]

//BOF - Manufacturers Slider
  $manufacturers_array = '';
  $manufacturers_query = "select distinct m.manufacturers_id, m.manufacturers_name, m.manufacturers_image from ".TABLE_MANUFACTURERS." as m, ".TABLE_PRODUCTS." as p where m.manufacturers_id=p.manufacturers_id order by m.manufacturers_name";
  $manufacturers_query = xtDBquery($manufacturers_query);
  while ($manufacturers = xtc_db_fetch_array($manufacturers_query, true)) {
    $manufacturers_array[] = array ('ID'    => $manufacturers['manufacturers_id'],
                                    'NAME'  => $manufacturers['manufacturers_name'],
                                    'IMAGE' => $manufacturers['manufacturers_image'],
                                    'URL'   => xtc_href_link(FILENAME_DEFAULT, 'manufacturers_id='.$manufacturers['manufacturers_id']));
  }
  $smarty->assign('manufacturers_array', $manufacturers_array);
//EOF - Manufacturers Slider

Mal schauen ob es dann geht, ansonsten Quelltext noch mal posten.

Viele Grüße

Franky

[koshiro]

Hallo Franky,
also die Bildrahmen mit dem Name drin ist schon mal da wenn, aber nicht das Bild selber.
In der Stysheet habe ich das hier drin

Code: CSS  [Auswählen]

#slider{width:980px;height:50px;border:0px;background:#ffffff;position:relative;margin-bottom:4px;}
.scrollable{position:relative;overflow:hidden;width:880px;height:50px;float:left;}
.scrollable .items{width:20000em;position:absolute;clear:both;}
.items div{float:left;width:880px;}
.scrollable img{float:left;margin:5px 2px 0 5px;background:#fff padding:2px;border:1px solid #ccc;width:100px;height:40px;-moz-border-radius:4px;-webkit-border-radius:4px;}
a.browse{background:url(img/slider/hori_large.png) no-repeat;display:block;width:30px;height:30px;float:left;margin:10px 10px;}
a.right{background-position:0 -30px;clear:right;margin-right:0px;}
a.right:hover{background-position:-30px -30px;}
a.right:active{background-position:-60px -30px;}
a.left{margin-left:10px;}
a.left:hover{background-position:-30px 0;}
a.left:active{background-position:-60px 0;}

Wenn ich über Firebug schaue, dann zeigt er mir bei <div class items> das hier an style="left: -981px;" und ich weiss nicht woher er das holt.
Gruß
Micha

[koshiro]

Hallo Franky,
so sieht es jetzt im Quelltext aus,

Code: PHP  [Auswählen]

<div id="slider">
    <a class="prev browse left"></a>

      <div class="scrollable">
        <div class="items">
                         <a href="http://localhost/esv/index.php?manufacturers_id=1"><img src="manufacturers/axami_logo.jpg" alt="Axami" /></a>
                                 <a href="http://localhost/esv/index.php?manufacturers_id=4"><img src="manufacturers/chilirose.jpg" alt="Chilirose" /></a>
                                 <a href="http://localhost/esv/index.php?manufacturers_id=7"><img src="manufacturers/Gracya.jpg" alt="Gracya" /></a>
                                 <a href="http://localhost/esv/index.php?manufacturers_id=9"><img src="manufacturers/logo-Konrad.jpg" alt="Konrad" /></a>
                                 <a href="http://localhost/esv/index.php?manufacturers_id=14"><img src="manufacturers/obsessive-logo.jpg" alt="Obsessive" /></a>
                                 <a href="http://localhost/esv/index.php?manufacturers_id=25"><img src="manufacturers/Roza.jpg" alt="Roza" /></a>
                                 <a href="http://localhost/esv/index.php?manufacturers_id=18"><img src="manufacturers/wolbar.jpg" alt="Wol-Bar" /></a>

                         </div>
      </div>
    <a class="next browse right"></a>
  </div>
 

aber er zeigt mir nur die Platzhalter für die Bilder an, aber nicht die Bilder selber.
Gruß
Micha

[franky_n]

Hallo koshiro,

dann nimm doch mal anstatt:

Code: PHP  [Auswählen]

'IMAGE' => $manufacturers['manufacturers_image'],

das:

Code: PHP  [Auswählen]

'IMAGE' => DIR_WS_IMAGES .'manufacturers/'.$manufacturers['manufacturers_image'],

Viele Grüße

Franky

[koshiro]

Hallo Franky,
ja das habe ich schon alleine herraus gefunden gehabt, das Funktioniert jetzt schon.
Ich bin nur auf der suche wo ich noch ein Fehler drin habe, denn er zeigt mir erst die Bilder an wenn ich auf Firebug rauf gehe und kurz mal das hier entferne style="left: -981px;" ich glaube da ist noch ein possitionierungsfehler drin, habe wie gesagt alles in der Stylesheet drin, und habe die javascript Datei angemeldet, aber ich weis in Moment nicht wo ich den Fehler suchen muss, hast Du da eventuell eine Idee für mich ?
Gruß
Micha

[franky_n]

Hallo koshiro,

ich denke das die stylesheet.css da nicht für zuständig ist das es auf -981px steht, sondern das das javascript diese Position festlegt um dann von dort aus los zu sliden...

Schau mal im javascript ob Du dort so was findest...

Viele Grüße

Franky

[koshiro]

Hallo Franky,
wärst Du so lieb, und könntest mal auf die Javascript Datei rauf schauen, ich finde da garnichts drin, das ist einfach nur ein ellen langer Code für mich.
Gruß
Micha

[franky_n]

Hallo koshiro,

das sind aber glaube ich nur die Funktionen die man nutzen kann.
Für den slider hast Du sicherlich noch eine ander js Datei eingebunden oder?
Woher hast Du denn den Slider? Vielleicht ist das dann für mich deutlicher...

Viele Grüße

Franky

[koshiro]

Hallo Franky,
wie der Slider Live aussieht kannst Du hier schauen, Link und diesen Slider versuche ich ja gerade mit Dir zusammen für die Hersteller Logos zu nutzen.
Eigentlich ist nur der Teil in der Stylesheet, dann in der general.js.php kommt das hier

Code: PHP  [Auswählen]

<script src="<?php echo 'templates/'.CURRENT_TEMPLATE; ?>/javascript/jquery.tools.min.js" type="text/javascript"></script>

Code: PHP  [Auswählen]

<script type="text/javascript">
var $j = jQuery.noConflict();
$j(function() {
        $j(".scrollable").scrollable({ speed: 2000, circular: true });
});
</script>
 

Dann in der Template Datei eintragen und noch in den Ordner Javascript die Datei jquery.tools.min rein
Gruß Micha
Micha

[franky_n]

Hallo koshiro,

die stylesheet.css hat ja das drin stehen:

Code: CSS  [Auswählen]

#slider{width:980px;....

und daraus macht das javascript nun -981px um die Bilder erstmal auszublenden.
Für mich ist das javascript auch nur alles ineinander geschrieben.
Das ist eine "optimierte" Datei und keine Entwicklerversion und somit alles in eine Zeile gschrieben...
Das was raus zu fischen wird nichts...

Wahrscheinlich wirst Du auf den Pfeil rechts drücken können und dann sliden die Bilder rein oder?

Laut Beispielseite:
Was bei Dir ja eigentlich nur noch fehlt ist das <div> in dem slider....
Also das nach:

Code: PHP  [Auswählen]

        <div class="items">

und unten das schließende

Code: PHP  [Auswählen]

</div>

Viele Grüße

Franky

[koshiro]

Hallo Franky,
Stimmt das mit dem einen Div hatte gefehlt jetzt geht es.
Gruß
Micha

[franky_n]

Hallo koshiro,

ich habe gerade schon gesagt das es eine optimierte Version ist und ich die auch nicht bearbeiten kann/werde, deswegen heißt die ja auch "min"...

Aber so wie ich das sehe hast Du ja auch noch nicht mal probiert die Breiten im stylesheet mal einfach zu verändern und zu schauen was passiert...

Viele Grüße

Franky

[koshiro]

Hallo Franky,
doch hatte ich schon versucht, aber wie gesagt, es lag nur an den einen Fehlenden Div, jetzt geht alles so wie es sein soll, die Bilder werden angezeigt, alles schickt. Ich danke Dir Deine Hilfe.
Gruß
Micha

[franky_n]

Hallo koshiro,

kannst Du evtl. noch mal alles posten inkl. meiner Änderungen damit es der Allgemeinheit zur Verfügung steht?

Viele Grüße

Franky

[koshiro]

Hallo Franky,
ja ich mache dann nachher ein komplett Paket mit dem Slider fertig, und mache dann einen neuen Tread unter Module auf, und stelle das komplette Modul mit Installationsanleitung ein.
Gruß
Micha