Unofficial WebSite X5
WebSite X5 v14 Evolution/Professional => WebSite X5 [v14] - Evolution/Professional - Discussioni generali => Topic aperto da: giancarlobar - 02 Dicembre, 2017, 10:21:55
-
Buongiorno,
sto utilizzando un codice iframe messo a disposizione dal gentilizzimo KolAsim.
Il codice in oggetto mi permette di inserire wowslider sotto all'header della pagina.
Questo però mi crea due piccole anomalie:
1) Un effetto elastico di qualche secondo all'ingresso della pagina prima di adattarsi.
2) Va in conflitto con l'effetto parallasse e quindi ho dovuto disattivarlo.
E' possibile un'alternativa al codice che eviti questi piccoli inconvenienti.
Grazie.
http://www.giancarlob.altervista.org/apollinare-wowslider/
-
Non so se risolverai i tuoi problemi ma, l'integrazione di WOWSlider (come ben saprai), si può fare anche senza l'uso di iframe.
QUI (http://www.unofficialwsx5.com/index.php?topic=2236.0) un topic dove trovi un esempio (v13): menu il alto (non fisso), slider sotto.
Nel tuo caso puoi provare questa variante (v13):
http://quellidelcucuzzolo.altervista.org/appunti/ws-wowslider/variante-1.html (http://quellidelcucuzzolo.altervista.org/appunti/ws-wowslider/variante-1.html)
Anche qui però c'è un po' di ritardo prima del calcolo della nuova altezza dell'header.
Come già scritto, non so se risolverai i tuoi problemi!
Edit:
Ovviamente le immagini devono avere le stesse dimensioni.
-
Grazie Lemonsong, molto interessante ..... faccio qualche test per verificare come si comporta sul mio progetto.
-
Forse, per guadagnare qualcosa al caricamento della pagina, potresti sostituire lo script con qualcosa del genere:
<script>
//regolazione altezza header
$(document).ready(hD);
$(window).on('resize', hD);
function hD() {
var hImg = $('#wowslider-container1 img').height();
$('#imHeader').css('height', hImg);
}
</script>
-
fatto il test, il codice sembra inserito correttamente, ho provato a giocare con le z-index ma l'header mi resta sotto allo slider... ???
http://www.giancarlob.altervista.org/apollinare-wowslider/
-
Il CSS dell'esempio che ti ho postato deve essere inserito dopo il file engine1/style.css oppure devi aggiungere !important alle due proprietà; ti consiglio la prima.
Inoltre, devi riassegnare z-index:1; a #imHeaderBg
Ti allego lo screenshot della tua pagina editata con gli strumenti di sviluppo di Firefox:
[attach=1]
-
perfetto !!!! Grazie Lemonsong ..... :)
-
Prego :)