zoom immagine dentro immagine [era: Quale tecnica si utilizza?]

[MrJester]

Ciao a tutti,
Non so se questa è la sezione giusta per parlare, chiedere e confrontarsi su questa cosa, comunque...
Secondo voi con quale tecnica è stato creato questo sito?
http://one.htc.com/experienceit/inde...view=BlinkFeed

[Mattia Vio]

jquery a manetta ? vedo flexbox ecc...

[MrJester]

Yes...ma esiste un plugin che fa quell'effetto zoom dentro l'immagine?

[br1]

Originariamente inviato da MrJester
Yes...ma esiste un plugin che fa quell'effetto zoom dentro l'immagine?

... e allora non dire genericamente "questo sito" ...

comunque mi spiace, non lo so

[Mattia Vio]

<div class="plaxCard ch3Copy chapterCopy efframed ng-binding" ng-bind-html-unsafe="copy.translated.ch3.copy.__cdata" style="opacity: 1; -webkit-transform: scale(0.6370499999999992, 0.6370499999999992) translate3d(315.4906731549075px, 239.52593987913087px, 0px) rotate(0.1deg);">

Tutti i tuoi contenuti preferiti in <span class="green">live</span> streaming.
</div>

chrome ---> ispeziona elemento ---> selezioni quello che si ingrandisce ---> inizia a cercare nel codice tutte quelle classi e il js che le modifica

pare che ogni secondo aumenti la dimensione di x e y di un tot ...

[wartpro]

Veramente bello l'effetto. Effettivamente è d'ispirazione. Mi ha aperto una voragine in testa!
Grazie per averlo tirato fuori.

Ad ogni modo, plugin o non plugin non è malefico. Ho contato tre livelli. Basta farli partire in animazione uno con un delay definito dall'altro. Dargli una direzione ed è fatta.

La cosa bella è che hanno integrato un reel, con dissolvenza. Quindi a tutto l'ambaradam hanno aggiunto il tempo e la ripetizione.

Da fare.

[MrJester]

Originariamente inviato da Mattia Vio
<div class="plaxCard ch3Copy chapterCopy efframed ng-binding" ng-bind-html-unsafe="copy.translated.ch3.copy.__cdata" style="opacity: 1; -webkit-transform: scale(0.6370499999999992, 0.6370499999999992) translate3d(315.4906731549075px, 239.52593987913087px, 0px) rotate(0.1deg);">

Tutti i tuoi contenuti preferiti in <span class="green">live</span> streaming.
</div>

chrome ---> ispeziona elemento ---> selezioni quello che si ingrandisce ---> inizia a cercare nel codice tutte quelle classi e il js che le modifica

pare che ogni secondo aumenti la dimensione di x e y di un tot ...

Tra il dire e il fare c'è di mezzo il mare...almeno per me, avevo avuto un'intuizione del genere ma mi risulta veramente difficile procedere a fare tutto...

[Mattia Vio]

Originariamente inviato da wartpro
Veramente bello l'effetto. Effettivamente è d'ispirazione. Mi ha aperto una voragine in testa!
Grazie per averlo tirato fuori.

Ad ogni modo, plugin o non plugin non è malefico. Ho contato tre livelli. Basta farli partire in animazione uno con un delay definito dall'altro. Dargli una direzione ed è fatta.

La cosa bella è che hanno integrato un reel, con dissolvenza. Quindi a tutto l'ambaradam hanno aggiunto il tempo e la ripetizione.

Da fare.

come ha detto wartpro son tanti delay ecc... non è impossibile ... è solo luuuuuuuuuuungo :P ma forse neanche tanto non ho approfondito ...

[wartpro]

Originariamente inviato da Mattia Vio
come ha detto wartpro son tanti delay ecc... non è impossibile ... è solo luuuuuuuuuuungo :P ma forse neanche tanto non ho approfondito ...

Infatti. Sulla lunghezza non saprei. Dipende quanta ne hai in materia. Ad ogni modo vedo che va a toccare proprietà css di livello 3. "transform" .. "scale" .. ecc.

Quando mi metterò su a farlo, se mi ricordo ritorno e vi dico.