Background-attachment

Membre supprimé 1088918 · 29 Juin 2013

Bonjour à toutes & à tous !

J'ai de nouveau un petit problème en HTML, et étant un GROS débutant, j'ai quand même réussi à mettre un nom sur ce que je cherche (enfin je crois... ^^).

J'aimerais par exemple mettre une image d'un moniteur d'ordi, et par dessus pile au niveau de l'écran du moniteur mettre une autre image que l'on pourra scroller dans ce fameux "moniteur"... Voyez ?

Il me semble donc qu'il faut me diriger vers le "Background Attachement" mais j'ai beau chercher, je ne comprends pas vraiment... D'ou mon appel à l'aide !

Merci d'avance à tous ceux qui me liront !

Cordialement. :zen:

momo-fr · 30 Juin 2013

2 div empilées, la première avec ton image ordi, la seconde avec en contenu l'image à scroller en hauteur.

La seconde div en position absolute par rapport à la première…

Pour le scroll attention, soit tu as la barre d'ascenseur visible à droite, soit tu n'en veux pas et là c'est avec Javascript qu'il te faudra composer…

Une version sans Javascript

Après pour le scroll ça peut être automatique avec arrêt au survol, ou à la souris, ou à la souris + clavier, faut prendre en compte le multitouch aujourd'hui… c'est déjà moins simple.

Bonnes recherches.

Membre supprimé 1088918 · 30 Juin 2013

Super... !! Merci beaucoup Momo, c'est déjà toi qui m'avait dépanné la dernière fois ! L'homme qu'on appelle au secours, c'est Momo !

En tout cas merci bien, c'est exactement ça !

Membre supprimé 1088918 · 1 Juillet 2013

Dis moi mon petit Momo,
J'ai un soucis... :siffle:

J'ai réussi à réutiliser ton code et à l'adapter comme je le veux pour ma pratique (ici si tu veux voir) et j'aimerais désormais l'intégrer dans une autre page de présentation de mes travaux. MAIS je me suis basé sur pleins de templates différents pour avoir ce que je veux (copier / coller de bout de CSS à droite, à gauche sur plusieurs site... :sick

, du coup, c'est un peu n'importe quoi dans mes CSS (présent dans mon <head>), du coup, ça me fait un de ces bordel...

Mais n'étant pas trop balaise dans le milieu, y'a t-il un moyen d'utiliser toutes les règles en vigeur que tu m'as indiqué pour ce scroll en les insérant uniquement dans mon <body> au niveau de l'image voulu ?

Je suis désolé, je ne pense pas être très clair...

Merci en tout cas déjà pour tout ce que tu as fait !

Cordialement.

momo-fr · 1 Juillet 2013

Tu utilises un CMS pour ton site ?

Avec un thème ?

Ajoutes les CSS de ton bazar dans le fichier CSS du thème ça évitera des surprises.

Si tu dois utiliser plusieurs fois ces CSS dans une seule page tu supprimes les ID pour les remplacer pour des classes :

#machin-chose {}

devient

.machin_chose {}

Mais chaque contexte de styles demande une adaptation du code j'utilise Firebug sous Firefox pour déterminer les parentés CSS d'un élément, c'est super pratique car tu peux changer en live les attributs pour voir ce qui ce passe.

Bon taf

Membre supprimé 1088918 · 1 Juillet 2013

Super !

Merci pour tes informations, je vais essayer d'adapter ça (c'est dure de débuter dans le code...

)
Je n'utilise pas de CMS, j'ai juste 4 ou 5 pages pour un "jolie" portfolio en ligne, donc c'est de la bricole !
Je te montrerai le résultat final (Si résultat... ^^)

A bientôt.

Background-attachment

Membre supprimé 1088918

Invité

momo-fr

Ancien Aveyronnais

Membre supprimé 1088918

Invité

Membre supprimé 1088918

Invité

momo-fr

Ancien Aveyronnais

Membre supprimé 1088918

Invité

Sujets similaires