Image du fond de page

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Image du fond de page

Message par feaths le Jeu 1 Nov 2012 - 21:03

Bonjour à tous, j'ai un petit problème avec l'image de mon fond de page, en fait elle se répète et je voudrais qu'elle prenne toute la page, sans à avoir augmenter les pixels de l'image, j'ai déjà essayer et c'est moche. J'ai aussi coché "image fixe" et j'ai testé le no-repeat dans mes codes, mais du coup l'image se centre et se cache derrière ma bannière. Je vous donne le lien pour que vous puissiez voir l'image de fond se répéter : cliquez là

Je remercie par avance des réponses et m'excuse si la question a déjà été posée mais en faisant une recherche je n'ai pas trouvé mon bonheur,

Very Happy


Dernière édition par feaths le Mar 6 Nov 2012 - 16:43, édité 3 fois

feaths
Nouveau membre

Messages : 6
Inscrit(e) le : 01/11/2012

http://testfow.forumactif.org/
feaths a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image du fond de page

Message par gdumouli le Jeu 1 Nov 2012 - 23:05

Bonjour, je débute dans le CSS mais je peux déjà t'aider un peu.

Donc déjà essaye d'avoir un fond d'écran avec plusieurs résolution.

1920 x 1200
1600x1200
1440x960
1280x800
1024x600

Tu les upload sur servimg.com

Après tu va dans PA>Module> Gestion des Code JavaScript

Après : Activer la gestion des codes Javascript, tu coches OUI

Ensuite : Créer un nouveau Javascript

Tu colles çà

Code:

$(function(){

var bg= "ton lien de l'image taille 1920";

if (screen.width < 1025) bg=" lien de l'image taille 1024";
else if(screen.width < 1281) bg="lien de l'image taille 1280";
else if(screen.width < 1441) bg="lien de l'image taille 1440";
else if(screen.width < 1601) bg="lien de l'image taille 1600";


document.body.style.backgroundImage="url(\""+bg+"\")";

});




Tu enregistres.


Ensuite : PA > Affichage > Couleur > Feuille de style CSS

Voilà le code
Code:

body {
   background-color: #000000;
   background-position: top center;
        background-attachment: fixed;
      }




J'espère que c'est çà ... mais attends qu'un pro passe Wink

gdumouli
*

Messages : 47
Inscrit(e) le : 26/10/2012

http://cmc-airsoft.forumactif.org/forum
gdumouli a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image du fond de page

Message par feaths le Ven 2 Nov 2012 - 21:18

Le truc c'est que mon image de fond je ne l'ai que dans une taille elle existe pas en autre taille, du moins j'ai pas trouvé. Et je sais qu'il est possible d'avoir d'arriver à ce que je veux sans avoir à avoir plusieurs taille d'image, seulement je ne sais pas comment le faire >_<
En tout cas merci de ta réponse Very Happy quelqu'un a une autre idée ?

feaths
Nouveau membre

Messages : 6
Inscrit(e) le : 01/11/2012

http://testfow.forumactif.org/
feaths a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image du fond de page

Message par MlleAlys le Ven 2 Nov 2012 - 21:26

si ton image est plus petite que la taille de ton écran et que tu veux vraiment remplir ce dernier, alors forcément elle doit être répétée...
sinon il faut que tu augmentes la taille de ton image, si la différence n'est pas trop importante (on ne la voit plus sur le lien), ça ne devrait pas trop se voir.

MlleAlys
+ Hyperactif +

Messages : 4407
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image du fond de page

Message par Anzu le Sam 3 Nov 2012 - 0:00


Bonsoir,

Je confirme la réponse de MlleAlys.
Il n'y a pas de code magique, il suffit de suivre ce qui a été dit plus haut Smile

Cordialement.

Bonjour,

Afin de faciliter la gestion des problèmes, si votre problème est résolu, pensez à :
  • éditer votre premier message,
  • cocher l'icône résolu
  • Et enregistrer en cliquant sur


Vous pouvez également remercier les personnes qui vous ont aidé, en cliquant sur le bouton

A bientôt sur ForumActif Smile

Anzu
+ Hyperactif +

Féminin
Messages : 20685
Inscrit(e) le : 30/08/2007

http://forum.forumactif.com/forum
Anzu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image du fond de page

Message par feaths le Dim 4 Nov 2012 - 23:34

merci pour les réponses Very Happy

feaths
Nouveau membre

Messages : 6
Inscrit(e) le : 01/11/2012

http://testfow.forumactif.org/
feaths a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image du fond de page

Message par feaths le Lun 5 Nov 2012 - 0:02

Finalement nan c'est pas résolut désolé >_< j'ai essayé de créer un fond avec une image super grande, résultat ben ça se répète encore alors que mon image fait 8000x5600px et peu importe la taille même quand j'insère un "no repeat" dans mon css l'image se retrouve dans un coin et la taille est ridicule T_T

feaths
Nouveau membre

Messages : 6
Inscrit(e) le : 01/11/2012

http://testfow.forumactif.org/
feaths a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image du fond de page

Message par gdumouli le Lun 5 Nov 2012 - 0:20

Tu as une image super grande. D'accord.

Tu l'as transformé en plusieurs résolutions ou pas ?

Tu as fait le Javascript ?
Puis je le voir ?

Puis je vois aussi ton CSS, le code body
( il est dans les premières lignes normalement )


gdumouli
*

Messages : 47
Inscrit(e) le : 26/10/2012

http://cmc-airsoft.forumactif.org/forum
gdumouli a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image du fond de page

Message par feaths le Lun 5 Nov 2012 - 12:14

Bon j'ai fait exactement pareil que tu m'as dis, voilà le résultat ici

Code:
body {
  background-color: #000000;
  background-position: top center;
        background-attachment: fixed;
      }

Voila pour mon css body et pour mon javascript :

Code:
$(function(){
       
        var bg= "http://imageshack.us/a/img5/2461/fd1920.png";
       
        if (screen.width < 1025) bg="http://imageshack.us/a/img217/6765/fd1024.png";
        else if(screen.width < 1281) bg="http://imageshack.us/a/img171/3153/fd1280.png";
        else if(screen.width < 1441) bg="http://imageshack.us/a/img846/8453/fd1440.png";
        else if(screen.width < 1601) bg="http://imageshack.us/a/img805/654/fd1600.png";
       
       
        document.body.style.backgroundImage="url(\""+bg+"\")";
       
        });

Du coup ça me fait quand même une mosaïque =/

feaths
Nouveau membre

Messages : 6
Inscrit(e) le : 01/11/2012

http://testfow.forumactif.org/
feaths a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image du fond de page

Message par gdumouli le Lun 5 Nov 2012 - 18:27

Bé oui ... toutes tes images font 800x560

Donc ca le répète.

Il faut que ton image soit au taille demandé.

Il te faut une image en 1024px par 600 px

Pour vérifier çà.

Tu ouvres ton image sous PAINT.

Puis Fichier > Propriété.

Et là tu as la taille en px de l'image.



Si tu veux je peux t'aider.
Je te fais les images. Il me faut juste ton image dans la plus grande résolution possible.

Merci.

gdumouli
*

Messages : 47
Inscrit(e) le : 26/10/2012

http://cmc-airsoft.forumactif.org/forum
gdumouli a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image du fond de page

Message par gdumouli le Mar 6 Nov 2012 - 13:46

Bon bé je fais tes images ...

C'était pas évident ... tes diagonales de couleurs n'avaient pas le même espacement ... bref, y'a fallu un peu plus de taff que prévu. Pas grave en soit, mais du coup je poste que maintenant.

Donc voilà le code à changer dans le JAVASCRIPT.

Code:

 
$(function(){
 
var bg= "http://i43.servimg.com/u/f43/17/83/44/81/1920x110.jpg";
 
if (screen.width < 1025) bg="http://i43.servimg.com/u/f43/17/83/44/81/1024x610.jpg";
else if(screen.width < 1281) bg="http://i43.servimg.com/u/f43/17/83/44/81/1280x810.jpg";
else if(screen.width < 1441) bg="http://i43.servimg.com/u/f43/17/83/44/81/1440x910.jpg";
else if(screen.width < 1601) bg="http://i43.servimg.com/u/f43/17/83/44/81/1600x110.jpg";
 
 
document.body.style.backgroundImage="url(\""+bg+"\")";
 
});
 

gdumouli
*

Messages : 47
Inscrit(e) le : 26/10/2012

http://cmc-airsoft.forumactif.org/forum
gdumouli a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image du fond de page

Message par feaths le Mar 6 Nov 2012 - 16:43

gdumouli je t'aime ça marche à la perfectionnnnn Very Happy merci merci milles fois I love you

feaths
Nouveau membre

Messages : 6
Inscrit(e) le : 01/11/2012

http://testfow.forumactif.org/
feaths a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image du fond de page

Message par gdumouli le Mar 6 Nov 2012 - 18:30

Pas de problème Wink

J'espère avant tout que tu as compris ce que j'ai fait ( à tes images) et comment ca fonctionnait Wink

gdumouli
*

Messages : 47
Inscrit(e) le : 26/10/2012

http://cmc-airsoft.forumactif.org/forum
gdumouli a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum