Effetto lente su testo

peoweb

Nuovo Utente
23 Gen 2013
9
0
1
Ciao a tutti,
spero di essere nel forum giusto ma onestamente non so con cosa fare ciò che cerco,
ho il testo "ENERGIA" e devo trovare il modo di ingrandirlo 1 o 2 lettere per volta da sinistra a destra come se ci passasse sopra una lente di ingrandimento.
Attenzione la "lente" deve essere invisibile, non devo vedere la lente, voglio solo le lettere che si ingrandiscono.
L'effetto deve partire una tantum dopo il caricamento della pagina in automatico.
Finora ho trovato script probabilmente più complessi che mi permettono di zoomare parti di immagini o di testi in base al clic e al movimento del mouse.
A me basterebbe lo facesse in automatico da solo una volta, stop.
Al massimo va bene se si attiva al mouseover ma non deve essere una risposta ad un'azione volontaria dell'utente.
Qualcuno può aiutarmi?
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao, potresti provare con un codice tipo questo
Codice:
<script type="text/javascript">
    var scritta = "ENERGIA";
    var x = 0;
    function scriviTesto() {
        var scrivi = "";
        for(var i in scritta) {
            if(x==i) {
                scrivi += "<span class='big'>";
            }
            scrivi += scritta[i];
            if(x==i) {
                scrivi += "</span>";
            }
        }
        document.getElementById("scritta").innerHTML = scrivi;
        if(x<=scritta.length) {            
            x++;
            setTimeout(function(){
                scriviTesto();
            },150);
        }else{
            x=0;
            setTimeout(function(){
                scriviTesto();
            },1250);
        }        
    }           
    window.onload = function(){
        scriviTesto();
    }
</script>
<style type="text/css">
    #scritta {
        width: 300px;
        height:32px;
        line-height: 32px;
        text-align: center;
        border: 1px solid blue;
        font-size: 1.9em;
        letter-spacing: 3px;
        font-family: Courier;
    }
    #scritta span.big {
        font-weight: bold;        
    }
</style>
<div id="scritta"></div>
Non ci ho pensato molto quindi è sicuramente da sistemare
 
Discussioni simili
Autore Titolo Forum Risposte Data
C Aiuto Effetto Lente/Zoom Flash Flash 1
P effetto lente Flash 5
E telecamera effetto nebbia IP Cam e Videosorveglianza 0
S [Photoshop] Nome di questo effetto (vedi foto) Photoshop 1
S [HTML] Effetto su testo da togliere HTML e CSS 0
F [Photoshop] Effetto "vetro" Photoshop 1
A [Photoshop] come poter realizzare il seguente "effetto" Photoshop 4
P [Photoshop CC] Come posso creare quest'effetto - cerchi concentrici Windows e Software 6
P [Photoshop] Effetto ombra Photoshop 1
R [HTML] Effetto carousel di testo su immagine fissa HTML e CSS 2
trattorino [Javascript] effetto carino sul click mi aiutate? Javascript 1
Andrea_Ventura [HTML] Problemi con effetto hover HTML e CSS 5
M [Photoshop] Come posso creare questo effetto ? Photoshop 2
T [Javascript] identico carousel con effetto fade: in una pagina va in un'altra no, mistero? Javascript 3
I Effetto glowing su immagine con GIMP Webdesign e Grafica 0
MimmoMandrillo [Photoshop] Che effetto è questo? Photoshop 3
R [Photoshop] Come creare questo effetto (v.immagine)?(sovrapposizione immagini in modo uniforme) Photoshop 2
D [Photoshop] Come arrivare a questo effetto? Photoshop 4
S [Photoshop] aiuto effetto glitch scanner (scanner art) Photoshop 1
A Effetto hue-rotate con javascript Javascript 2
elpirata Creare scritte flash effetto dinamico Flash 2
A [HTML] Menu con effetto slide down HTML e CSS 0
M [HTML] Slideshow immagini con effetto FADE HTML e CSS 2
F [HTML] Navbar interferisce con codice per effetto parallax HTML e CSS 2
D effetto con adobe muse Windows e Software 1
X [Photoshop] Cercasi strumento per ottenere un semplice effetto. Photoshop 6
F [HTML] Effetto fade su ogni immagine contenute in uno slider HTML e CSS 16
S [HTML] Effetto hover in un div HTML e CSS 6
M [Photoshop] come realizzare un effetto speciale? Photoshop 1
D [HTML] Sfondo-Background fisso ma non troppo con effetto in movimento HTML e CSS 4
R [HTML] Pulsante con effetto dissolvenza (fading) HTML e CSS 10
trattorino [Javascript] caricamento immagine con effetto fade Javascript 1
R Effetto sul testo Javascript 3
K Effetto psichedelico Flash 0
G Effetto mosso tipo calce. Photoshop 1
P Effetto spruzzo di profumo Photoshop 1
J Aggiunta di un effetto di transizione al plugin Quick Pager jQuery 0
L effetto galleria popup (immagini) jQuery 1
M effetto del testo css HTML e CSS 1
Z Effetto pennello con Flash Flash 0
P Visualizzare video mp4 con effetto lightbox jQuery 1
L Effetto fade a div Javascript 1
L Effetto hover con jquery jQuery 2
F effetto movimento immagini jquery jQuery 3
matteoraggi Come si fa a ricreare l'effetto dei pesciolini? WordPress 3
F Effetto comparsa header Javascript 2
F mappa jquery con effetto hover + fancybox Javascript 1
F Come si chiama questo effetto hover? Javascript 1
J effetto sliding dors come cover per entrare in un sito JQ Javascript 0
D Effetto foto come quella di Mika Photoshop 1

Discussioni simili