Parallasse e dimensioni problema iphone
Autore: Uberto Piccardo
Visite 1071,
Followers 2,
Condiviso 0
Buongiorno, stò realizzando un sito solo su una pagina e volevo fosse visibile l'effetto parallasse anche sui dispositivi mobili.
Visto che con responsive non si riesce, ho realizzato il sito con modalità desktop.
Sui dispositivi mobili android si vede alla perfezione mentre sui dispositivi come iphone il parallasse non funziona e neanche il ridimensionamento delle immagini e anche i caratteri sono differenti.
il sito in questione è www.andreacarratu.it
Grazie a chi mi può aiutare.
Postato il
... so che ci stanno lavorando, e nel caso puoi attendere ...
... intanto , e se ti interessa, per il para-parallasse-FISSO in alternativa, da alcuni anni propongo una mia invenzione esclusiva in diverse varianti a seconda dei casi...
... guardando il tuo LINK ho notato che è perfettamente compatibile ed applicabile in un secondo per le righe 1,3,5...
... per valutare se sui tuoi dispositivi funziona, controlla questa recente applicazione del mio codice in questo Sito del Forum Russo:
>> https://dym.by/
... il mio codice esclusivo è libero, facile e personalizzabile a piacere, e puoi far da te...
... se ti servissero chiarimenti, avvisami senza problemi, ed appena possibile ritornerò qui, ...ed eventualmente ti posterò il codice dedicato...
.
Buongiorno Uberto
Purtroppo il metodo scelto di procedere temo non sia valido
Oltre a peggiorare sensibilmente l'indicizzazione ed il punteggio SEO del sito creando un sito non Responsive, che è praticamente un obbligo al giorno d'oggi, il problema non viene risolto
Infatti, non è il responsive che crea il problema al Parallasse, ma il fatto che le tecniche usate per generare il parallasse sono proprio disabilitate in automatico anche dai browser quando il sitio viene caricato
Per questo motivo, il parallasse non potrà mai funzionare neanche nel caso del sito desktop
Consiglierei quindi di mantenere il sito responsive e rinuncia all'effetto su Mobile, concentrandosi invece su semplicità di navigazione e usabilità
Resto a disposizione
Stefano
Autore
Ciao KolAsim, purtroppo il link che mi hai scritto non funziona sui dispositivi apple iphone. Quindi credo che il tuo codice purtroppo non serva al mio scopo.
Stefano ti ringrazio della risposta, in questo caso non è importante la seo essendo un sito elettorale momentaneo! Era più importante la scenografia del sito. Con tutti i dispositivi android funziona il parallasse con sito desktop , controlla anche tu ; non funziona solo sui dispositivi apple.
Un aggiornamento in tal senso sarebbe utile.
Ciao Umberto, ... grazie per il Test...
... purtroppo non posso verificare sugli i(!)...
... forse potrebbe interessati; ...preso dal Forum EN questo LINK pare che funzionasse sugli i(!), con un mio codice EXTRA solo per lo sfondo FISSO della pagina (para-parallasse-fisso):
http://www.indesbilgisayar.com/emin2/
... oppure questo dal Forum DE:
https://www.webdesign-markersdorf.at/Garden/
.
ciao
.
Autore
Ciao KolAsim , perfetti questi due siti , funziona su i(!) ..... puoi darmi il codice e spiegarmi dove inserirlo?
Ti ringrazio !
... OK ... il codice è per uno sfondo FISSO per tutta la pagina, annullando quello esistente per le tre righe...
... se di una riga vorresti continuare a vedere l'immagine che avevi messo, o per dei test, modifica nel codice STYLE il nome con una X, per esempio per la seconda riga #imPageRowGraphics_3
#imPageRowGraphics_3X
... codice completo:
<style>
/** -- sfondo fisso by KolAsim -- **/
#imPageExtContainer ,
#imPageRowGraphics_1 ,
#imPageRowGraphics_3 ,
#imPageRowGraphics_5
{ background:transparent url("") !important }
</style>
<script>
$( document ).ready(function() {//K
divK='<div id="contenitoreK" style="position:fixed; top:0px; width:100%; height:100%; z-index:-1;"><div id="div_customK" style="position:absolute; top:0px; width:100%; height:100%; z-index:-1; background-repeat:no-repeat; background-image:url(\'http://www.andreacarratu.it/images/IMG_1710.jpg\'); -webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-size:cover; background-position: top center;"></div></div>';
document.body.innerHTML += divK;
}); //K<<
</script>
.
ciao
.
...x >> Passo 3 - Mappa > Finestra 'Proprietà Pagina' > Le opzioni della Sezione Esperto
>3^opzione -> Prima della chiusura del tag HEAD