Partage
  • Partager sur Facebook
  • Partager sur Twitter

Un effet lampe torche

Je cherche une piste

Sujet résolu
    13 juin 2010 à 23:23:31

    Bonjour,

    Je souhaite créer ma petite page perso style portfolio et j'ai envie de faire dans l'original.

    En fait, mon idée est de créer un site très sombre et faire en sorte qu'il s'illumine au passage de la souris, comme une lampe torche qu'on pointerais.
    Une sorte de démo se trouve ici (ça peut laguer si vous n'êtes pas un bon navigateur). Apparemment, on ne pourrait le faire qu'avec des images pour ce site. Donc ce n'est pas trop ce que je cherche.

    Je ne souhaite pas utiliser flash car je ne connais pas du tout, et je n'aime pas trop.
    Donc comme je ne vois pas comment je pourrais arriver à un tel résultat, je fais appel à vous si vous avez des idées, ou des pistes vers des frameworks ou alors m'assurer que c'est carrément impossible :-°

    Merci !
    • Partager sur Facebook
    • Partager sur Twitter
      13 juin 2010 à 23:48:09

      Ben ce que tu pourrais faire c'est le voir d'un différent angle! Cherche à créer à faire un claque sombre avec plein de div de 1px ainsi pour chacune d'elle tu peux régler la couleur + alpha. Puis en fonction de la position de souris tu les rends plus au moins visible... Tu peux utiliser une image pour que ce soit plus réaliste!
      Je doit aussi rappeler que la démo est en HTML5 mais ce que je te propose peux être programmé très basiquement en (x)Html + javascript.
      • Partager sur Facebook
      • Partager sur Twitter
        14 juin 2010 à 0:04:53

        Moui, mais comment je met ma page web dans des petits cubes de 1x1 ?
        • Partager sur Facebook
        • Partager sur Twitter
          14 juin 2010 à 0:47:42

          Le seul moyen que je vois serait d'utiliser une image en position absolue noire avec au centre de cette image un cercle transparent. Avec javascript placer le milieu de l'image au niveau de la souris.

          Notes que le gif ne gère pas les effets d'ombre transparente, il te faudra donc une image png24 pour tous les navigateurs et un gif pour ie6. Le gif devra lui avoir un rond sans dégradé de transparence.

          Je n'ai jamais essayé mais ça me semble viable.
          • Partager sur Facebook
          • Partager sur Twitter
            14 juin 2010 à 0:54:32

            A oui, ça devrait marcher beaucoup mieux. C'est exactement l'inverse. Au lieu de modifier le background du body, il suffit juste de faire glisser une très grande image au dessus du site web.

            Je crois que je vais m'en sortir. Merci à vous deux !
            • Partager sur Facebook
            • Partager sur Twitter
              14 juin 2010 à 11:18:41

              C'est pareil que mes div sauf que pas besoin d'une image lourde...
              • Partager sur Facebook
              • Partager sur Twitter

              Un effet lampe torche

              × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
              × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
              • Editeur
              • Markdown