Bilderslider mehrfach benutzen

[beatrix_3000]

Hallo, vielleicht hab ich ja Glück und mir kann hier jemand auf die Sprünge helfen
Ich habe einen Bilderslider "flexslider" in meine eingebaut:
Nun möchte ich auf der Seite STIFTUNG und auf weiteren Seiten den flexslider noch mal benutzen, aber an anderer Stelle - nämlich im Text-und mit einem anderen Aussehen. Hat jemand einen Tipp für mich, wie ich das machen muss?
Und dann ist es so, dass die zurück und vorwärts Buttons nicht sichtbar sind (sie sind aber da), da hab ich irgendwas im css falsch, aber was?
Über einen Tipp würde ich mich sehr freuen.
Bea

 

[Kayko]

Du kannst die Pfeile nicht sehen, weil du in der flexslider.css in deiner Klasse

.flex-direction-nav a {opacity: 0;}

stehen hast. Setz mal einen Wert größer Null ein, dann siehst du sie.
LG
Kayko

 

[beatrix_3000]

Guten Morgen,
super, vielen Dank schon mal Kayko für den Tipp, Nun muss ich noch an der Positionierung der Pfeile arbeiten, aber das bekomm ich wohl hin.
Bei der Sliederbenutzung hab ich vergessen zu erähnen, das der zweite Slider im Text mit einem andern theme dargestellt werden soll. Vielleicht hat da ja noch jemand einen Tipp für mich.
Einen sonnigenStart in den Tag.
Beatrix

 

[beatrix_3000]

Nicht, dass ich ungeduldig erscheinen möchte, aber ... vielleicht ist die Frage zu speziell? Oder hab ich sie falsch gestellt? Oder geht es einfach nicht? Ich weiß grad echt nicht weiter,
Beatrix

 

[beatrix_3000]

Hallo, ich frag noch mal anders, vielleicht bekomm ich ja noch einen Hinweis:
Ist es realisierbar, einen Bilderslider (flexslider)auf einer Website mit unterschiedlichen themes zu nutzen?
Wenn ja, wie geht es?
Wenn nein, bitte ich um kurze Nachricht.
Herzlich
Beatrix

 

[ElementZ]

Hi,
wie wählst du denn Themes?
Machst du das über den CSS-File, sodass das Script immer wieder auf den gleichen file zugreift?
Dann würde ich das so machen, dass ich 2 verschiedene Flexslider verwende. Das eine in Ordner A für die Startseite und das andere in Ordner B für eine andere Seite. So hast du 2 Flexslider parallel laufen und kannst die Designs separat einstellen.

Grüße
ElementZ

 

[beatrix_3000]

Hallo ElementZ,
vielen Dank für Deine Antwort.
HHm, das Ganze läuft über den Aufruf js. Hier mal die flexslider seite: http://flexslider.woothemes.com/thumbnail-slider.html

Also ich ruf den NormalSlider (oben im Bild) über J S auf:
$(window).load(function() {
$('.flexslider').flexslider();
});
aufgerufen.
Das zweite Thema heißt Slider with Carousel Slider as Navigation und wird auch mit js:
$(window).load(function() {
// The slider being synced must be initialized first$('#carousel').flexslider({animation: "slide",controlNav: false,animationLoop: false,slideshow: false,itemWidth: 210,itemMargin: 5,asNavFor: '#slider'
});
$('#slider').flexslider({
animation: "slide",
controlNav: false,
animationLoop: false,
slideshow: false,
sync: "#carousel"
});
});
Nun kann ich leider kein js, kann ich beide auf einer Seite aufrufen, und dann dem zweiten Aufruf ein anderes css zuweisen? Aber wo?
LIebe Grüße
Bea

 

[ElementZ]

Wenn du 2 Slider hast, pack die Bilder in 2 verschiedene divs, denen du dann eine ID gibst.
Du kannst sie dann über:

$('#iddeinesdivs').flexslider({
....
});

aufrufen. Das machst du einfach 2 mal für jeden Slider und das sollte dann funktionieren.

 

[afr0kalypse]

in deinem quelltext steht folgendes:

$(window).load(function() {
$('.flexslider').flexslider();
});

Das bedeutet, dass für das HTML Element mit dem Attribut class="flexslider' ein flexslider geladen wird.
Wenn du jetzt irgendwo in deinen Texten einen passenden Div Container unterbringst, sollte das problemlos funktionieren...

<p>bla bla text</p>
<div class="flex-container">
   <div class="flexslider">
       <ul class="slides">
           <li> <img src="bild1.jpg" /> </li>
           <li> <img src="bild2.jpg" /></li>
           <li> <img src="bild3.jpg" /> </li>
       </ul>
   </div>
</div>
<p>noch mehr text</p>