galleria jquery: problema nel caricamento di una immagine da un'anteprima

[arval]

Ciao ragazzi, sono nuova sul forum e dopo aver fatto una ricerca credo di non aver trovato in altre discussioni già esistenti il mio problema, anche perchè credo sia alquanto assurdo!

In pratica sto sviluppando un sito web html con l'aiuto di javascript e plugin jquery (entrambi non li conosco quasi per niente, ovviamente è già in programma di mettermi un pò a studiacchiare questi linguaggi, solo che ne ho avuto bisogno e ho dovuto usarli anche senza conoscerli, cercando di arrangiare un pò...).
In particolare ho creato una photo gallery avvalendomi del plugin jquery Galleriffic, che, come potete vedere qui online ho adattato alla struttura del sito che sto creando. L'unico problema è che, come noterete voi stessi, al clic delle anteprime l'immagine ingrandita viene caricata più in basso per poi stabilizzarsi sulla sua giusta posizione.
Ora ammetto che sicuramente mi starà sfuggendo una stupidaggine, ma non riesco proprio a venirne a capo e siccome è piuttosto urgente, chiedo il vostro aiuto mentre io continuo a sbatterci la testa cercando l'errore

Certi della vostra preziosa disponibilità vi saluto!!

 

[criric]

Ciao e benvenuta
modifica il tuo css (style.css)
da cosi

div.slideshow-container {
    width: 100%;
    float: left;
}

a cosi

div.slideshow-container {
    width: 100%;
    float: left;
    height:480px;
    overflow:hidden;
}

 

[arval]

Ciao e benvenuta
modifica il tuo css (style.css)
da cosi

div.slideshow-container {
    width: 100%;
    float: left;
}

a cosi

div.slideshow-container {
    width: 100%;
    float: left;
    height:480px;
    overflow:hidden;
}

innanzitutto grazie in effetti così non si sposta..o meglio..la prima foto no, le successive sì, non come prima, ma di una decina di px si e non solo verso il basso ma anche verso dx (basta guardare il bordo delle img, si vede appena...)

 

[criric]

aggiusta l'altezza, ho visto che le immagini sono alte 468px a cui dovrai aggiungere i bordi
modifica i px dell'height cosi

div.slideshow-container {
    width: 100%;
    float: left;
    height:472px;
    overflow:hidden;
}

io il salto l'ho notato solo quando clicchi sulla thumb dell'immagine corrente e solo in verticale
che browser utilizzi?

 

[arval]

aggiusta l'altezza, ho visto che le immagini sono alte 468px a cui dovrai aggiungere i bordi
modifica i px dell'height cosi

div.slideshow-container {
    width: 100%;
    float: left;
    height:472px;
    overflow:hidden;
}

io il salto l'ho notato solo quando clicchi sulla thumb dell'immagine corrente e solo in verticale
che browser utilizzi?

Ho modificato come mi hai detto ma non è cambiato nulla. Io uso chrome, in effetti con mozilla accade come hai detto tu.

 

[criric]

io lo vedo nello stesso modo anche su chrome, probabilmente abbiamo la risoluzione schermo diversa
credo infatti che ti converrebbe rivedere la struttura HTML
hai provato a ridimensionare il browser?

intanto sposto la discussione nella sezione html è piu probabile trovare altri pareri li

 

[arval]

io lo vedo nello stesso modo anche su chrome, probabilmente abbiamo la risoluzione schermo diversa
credo infatti che ti converrebbe rivedere la struttura HTML
hai provato a ridimensionare il browser?

intanto sposto la discussione nella sezione html è piu probabile trovare altri pareri li

In realtà dovrebbe essere un layout responsive, con i mediaqueries Infatti se lo ridimensioni i box si spostano uno sotto l'altro, anche se vedo uno spazio che non dovrebbe esserci tra l'immagine grande e il box delle anteprime. Comunque io ricordo che prima veniva visualizzata correttamente sia la photogallery che il layout resp (non c'era quello spazio eccessivo tra i box). La verità è che questa pagina l'avevo fatta un mesetto fa e l'ho dovuta abbandonare per dedicarmi ad altre pagine. Non vorrei (e credo sia successo così, a questo punto), che involontariamente abbia modificato qualche css (o jquery) che non dovevo. Ora il problema è andare a capire quale....Altra cosa in explorer, come sempre, non viene visualizzata per niente, come non viene visualizzato lo scroll del text ecc (era impostata modalità browser: visualizzazione compatibilità IE9; cambiandolo in "Internet Explorer 9" si visualizza tutto correttamente anzi, ti dirò di più, non mi da nessun errore che invece mi da chrome, tranne il fatto che ricliccando sulla stessa anteprima me la sposta leggermente in basso..)

 

[criric]

ci sono delle immagini che non vengono trovate dal bw
"NetworkError: 404 Not Found - http://villaggisolemare.altervista.org/img/back4.png"
"NetworkError: 404 Not Found - http://villaggisolemare.altervista.org/images/struttura/img9.jpg"
forse una di queste ti crea lo spazio di cui parli

prova anche a validare i css
http://jigsaw.w3.org/css-validator/
ci sono un paio di errori che potrebbero dare fastidio

mediaqueries

prima volta che ne sento parlare :book:

 

[arval]

basta che cerchi su google media queries e capisci cosa intendo, comunque consiste nel creare un foglio stile di default e uno per tutte le altre risoluzioni.

"NetworkError: 404 Not Found - http://villaggisolemare.altervista.org/images/struttura/img9.jpg"

a me non risulta questo errore..

L'altro sì e ho tolto quel div inutile.
La validazione l'ho fatta e mi ha dato alcuni errori che ho aggiustato ma che comunque non centravano nulla (tant'è che non è cambiato niente...).

 

[criric]

basta che cerchi su google media queries

si avevo guardato, mai usati

nella seconda pagina delle thumbs la prima immagine (quindi la 9 in ordine ) non la vedo apparire nello slide

 

[arval]

assurdo, con mozilla non appare, con chrome si!!!Vabbè ma il problema principale, ahimè, resta...