[FINI] Page Web avec Komposer > créer par dessus une ima

Le premier forum francophone sur l'éditeur de pages Web multiplateforme (Linux, Mac OS X, Windows) qui monte… KompoZer, héritier de Nvu, permet de créer vos pages Web graphiquement (wysiwyg) sans aucune connaissance du langage HTML.

Modérateur : chinon37

Répondre
Tmetha
Arias
Messages : 5
Inscription : 20 mai 2007, 16:47

[FINI] Page Web avec Komposer > créer par dessus une ima

Message par Tmetha »

Je travail sur Kompozer et je débute.

1) Je voudrais simplement avoir une image en fond, qui prenne tout l'écran des visiteurs et mettre par dessus des boutons ou des liens à divers endroits de l'image.

J'ai bien créé ma page et inséré mon image aux dimensions 100% sur 100%
Mais j'ignore comment insérer des éléments par dessus.

Ce serait des mots commes liens ou diaporama, linkés vers les pages correspondantes.

J'ai aussi essayé en créant un style css, j'y est mis l'image, j'ai tout régélé, ... mais rien n'apparaît sur ma page

2) Je n'arrive pas a modifier les textes liés. Ils sont bleu et soulignés quoi qu'il arrive


Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
Dernière modification par Tmetha le 22 mai 2007, 19:15, modifié 1 fois.
myahoo
Animal mythique
Messages : 8278
Inscription : 02 sept. 2005, 00:13

Message par myahoo »

Pourrait-on avoir l'adresse de ta page Web, histoire de facilement deviner / trouver d'où vient le problème ? :wink:

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr-FR; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
chinon37
Animal mythique
Messages : 5319
Inscription : 21 mars 2005, 10:17

Message par chinon37 »

Pour écrire sur une image, il faut que celle-ci soit en background (fond)
Format > couleur et fond de page > image de fond > clic sur l'icône de dossier pour chercher l'image. vérifier que l'image est bien dans le même dossier que la page html et que l'adresse est relative. Si l'adresse est absolue (chemin complet) vérifier qu'elle ne pointe pas vers le disque dur.
Préferez Kompozer 0.8 à Nvu
Défendons nos valeurs, adhérons à l'APRIL
La Démocratie, c'est quand on frappe à votre porte à 6h00 du matin, et que c'est le laitier.
Tmetha
Arias
Messages : 5
Inscription : 20 mai 2007, 16:47

Message par Tmetha »

Je n'ai pas encore l'hébergement pour l'instant je crer les pages avec Komposer.
chinon37 a écrit :Pour écrire sur une image, il faut que celle-ci soit en background (fond)
Format > couleur et fond de page > image de fond > clic sur l'icône de dossier pour chercher l'image. vérifier que l'image est bien dans le même dossier que la page html et que l'adresse est relative. Si l'adresse est absolue (chemin complet) vérifier qu'elle ne pointe pas vers le disque dur.
J'ai fais ca et ca fonctionne

Merci
Par contre il serait possible de redimenntionner toute la page pour qu'elle ne soi dimentionner qu'a 100% des dimension du navigateur ?

surtout que la quand je fai un apercu dand le navigateur j'ai que le coin haut gauche de l'image et je ne peux pas aller a droite ou a gauche.

Je veux l'image en pleine page avec mes liens dessus

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
chinon37
Animal mythique
Messages : 5319
Inscription : 21 mars 2005, 10:17

Message par chinon37 »

Sauf erreur, une image de fond ne peut pas être redimensionnée: elle s'affiche selon la taille du fichier image.
Par contre, elle peut être répétée en vertical ou en horizontal et elle peut être centrée sur la page.
Préferez Kompozer 0.8 à Nvu
Défendons nos valeurs, adhérons à l'APRIL
La Démocratie, c'est quand on frappe à votre porte à 6h00 du matin, et que c'est le laitier.
myahoo
Animal mythique
Messages : 8278
Inscription : 02 sept. 2005, 00:13

Message par myahoo »

Autant utiliser une petite feuille de style (CSS) pour détecter la résolution des visiteurs, et leur fournir une image de fond en fonction de ça :P

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr-FR; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
Tmetha
Arias
Messages : 5
Inscription : 20 mai 2007, 16:47

Message par Tmetha »

ouaou myahoo j'aime bien ton idée ...

Mais heu ... je peux savoir comment tu t'y prends ?

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
myahoo
Animal mythique
Messages : 8278
Inscription : 02 sept. 2005, 00:13

Message par myahoo »

Des solutions CSS yanna plusieurs, c'est certain ; le mieux à ce sujet serait de passer voir les gentils d'Alsacréations.

Sinon, on peut y aller méchamment en mettant ce script dans le code source de la page…

Code : Tout sélectionner

<script language="JavaScript">
   function retailler(x,y) { self.resizeTo(x,y); }
   if (screen.width <= 800) { fichier = '800.css' ; } 
      else if (screen.width <= 1024) { fichier = '1024.css'; } 
   if (screen.width > 1024) { fichier = '1280.css'; } 
   document.write('<link href="'+ fichier + '" rel="stylesheet" type="text/css">'); 
</script>
… et se faire les quatre minuscules CSS (800.css, 1024.css…) contenant chacun un code de ce genre :

Code : Tout sélectionner

body {background-image:url("nomdelimagedefond800.jpg");}
Ils feront chacun appel à l'image de fond qu'il faut pour ce format-là.

Mais à tous les coups il y a mieux que ça :wink:

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr-FR; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
Tmetha
Arias
Messages : 5
Inscription : 20 mai 2007, 16:47

Message par Tmetha »

j'ai pas du enter les codes comme il fallait car ca ne change rien. Je doi redimensionner l'image manuellement et elle ne s'adapte pas a mon navigateur

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
myahoo
Animal mythique
Messages : 8278
Inscription : 02 sept. 2005, 00:13

Message par myahoo »

(Au temps pour moi, tu peux supprimer la deuxième ligne, celle de la fonction "retailler", elle n'a rien à voir)

Reprenons.

Le premier code (le JavaScript) est à mettre dans le fichier HTM ou HTML de la page où sera l'arrière plan.
C'est à mettre avant la balise </head>, ou éventuellement entre les deux balises <script language="JavaScript"> / </script> si elles existent déjà.
C'est donc bien ce code :

Code : Tout sélectionner

<script language="JavaScript">
   if (screen.width <= 800) { fichier = '800.css' ; }
      else if (screen.width <= 1024) { fichier = '1024.css'; }
   if (screen.width > 1024) { fichier = '1280.css'; }
   document.write('<link href="'+ fichier + '" rel="stylesheet" type="text/css">');
</script>
Ensuite, il faut des couples de fichiers : pour chacune des tailles d'écran, il y a une image et un fichier CSS associé.
Dans l'exemple donné, pour le 800 x 600, il y aura l'image nomdelimagedefond800.jpg et le fichier 800.css.
Ce CSS contiendra la commande et l'adresse de l'image :

Code : Tout sélectionner

body {background-image:url("nomdelimagedefond800.jpg");}
Mais pour ce que j'ai dit il s'agit d'une détection de la résolution d'écran du visiteur, et donc la désignation de l'image de fond lui correspondant.
Comme disait chinon37, il doit être impossible (ou sinon très ralentissant) d'avoir une image s'ajustant à la taille de la fenêtre.

Le plus rentable serait de mettre un dégradé et ou une douce image répétée en boucle sur toute la page…

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr-FR; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
Tmetha
Arias
Messages : 5
Inscription : 20 mai 2007, 16:47

Message par Tmetha »

bon je laisse tomber je ferais avec ce qu'il y aurra merci beacoup pour vos réponse mais les codes et le css c'est trop compliqué pour moi.

Merci a vous aurevoir

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
myahoo
Animal mythique
Messages : 8278
Inscription : 02 sept. 2005, 00:13

Message par myahoo »

Tmetha a écrit :bon je laisse tomber je ferais avec ce qu'il y aurra merci beacoup pour vos réponse mais les codes et le css c'est trop compliqué pour moi.
Au cas où, quand même :
myahoo a écrit :Des solutions CSS yanna plusieurs, c'est certain ; le mieux à ce sujet serait de passer voir les gentils d'Alsacréations.
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr-FR; rv:1.8.1.3) Gecko/20070309 Firefox/2.0.0.3
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 1 invité