Affichage pour le moins curieux....!

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

Résolu Affichage pour le moins curieux....!

Message par lmc38510 le Dim 26 Fév 2012 - 12:40

Bonjour à vous,

deux bizarreries d'affichage que je soumet ...différent d'un ordi à l'autre... Rolling Eyes


ci dessus
Sur mon portable Image de fond page 2 photos....? celle de l’extrême droite est la bonne ....(un détail également le corps du Forum n'est pas centré à l'écran ce qui expliquerai ce décalage)


ci dessus
Sur l'ordi Image de fond de l'en-tête 2 photos.....? celles de droite n'est pas la bonne.... (détail le corps du forum est centré sur l'écran....ce qui expliquerai le décalage sur le fond de l'entête....????)

Question donc...?
Pourquoi un affichage différent d'un ordi à l'autre reflexion
dans chacun des ces deux cas, quel est le problème pour l'un comme pour l'autre... Interrog

Au plaisir de vous lire

lmc38510
*****

Masculin
Messages : 532
Inscrit(e) le : 22/02/2012

http://arcanes.lacaverneauxgrimoires-forum.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage pour le moins curieux....!

Message par Dr. Karlos le Dim 26 Fév 2012 - 19:10

Bonsoir,

Vos deux problèmes sont reliés à la résolution d'écran des ordinateurs.

Pour l'affichage de l'image de fond de l'en-tête, insérez ce code dans votre CSS (PA | Affichage | Images et couleurs | Couleurs | Feuille de style CSS):
Code:
.headerbar {
background-color: #12A3EB;
background-image: url(http://www.archive-host.com/link/1bfea24ce9acc23ef1c54c888260f551ff248d98.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
margin-bottom: 4px;
padding: 0 5px;
}

Il empêchera la répétition du fond et l'élargira pour qu'il prenne toute l'en-tête.

Pour votre deuxième problème, je vous invite à lire ce sujet. Wink


Cordialement.


Dernière édition par Dr. Karlos le Dim 26 Fév 2012 - 21:47, édité 2 fois

Dr. Karlos
+ Hyperactif +

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

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

Résolu Re: Affichage pour le moins curieux....!

Message par lmc38510 le Dim 26 Fév 2012 - 19:18


Merci "Dr Karlos" ....code CSS appliqué...aucune modif sur l'affichage
Vérification faites sur les 2 ordi....."Sorry" Interrog

lmc38510
*****

Masculin
Messages : 532
Inscrit(e) le : 22/02/2012

http://arcanes.lacaverneauxgrimoires-forum.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage pour le moins curieux....!

Message par Dr. Karlos le Dim 26 Fév 2012 - 19:35

Essayez plutôt avec ce code:
Code:
.headerbar {
background-color: #12A3EB;
background-image: url(http://www.archive-host.com/link/1bfea24ce9acc23ef1c54c888260f551ff248d98.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
margin-bottom: 4px;
padding: 0 5px;
}

Si ça ne fonctionne pas, pouvez-vous poster votre CSS personnalisé ici?


Cordialement.

Dr. Karlos
+ Hyperactif +

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

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

Résolu Re: Affichage pour le moins curieux....!

Message par lmc38510 le Dim 26 Fév 2012 - 19:36

Je suis donc le "tuto"
http://forum.forumactif.com/t325386-image-de-fond-changeante-selon-la-resolution-du-visiteur
Je vais donc héberger tous les formats précisés, ensuite faire le CSS comme indiqué...puis le 2ème CSS ...pour aligner votre fond au centre de l'écran

Je reçois ton 2ème message.... donc à suivre...! Wink

lmc38510
*****

Masculin
Messages : 532
Inscrit(e) le : 22/02/2012

http://arcanes.lacaverneauxgrimoires-forum.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage pour le moins curieux....!

Message par lmc38510 le Dim 26 Fév 2012 - 19:43


Aucun changement avec 2ème CSS....
Qu'entend tu par CSS personnalisé.... tout ce que j'ai en CSS...?
Pour lesquels je te fais une copie sur ce "post"...?

lmc38510
*****

Masculin
Messages : 532
Inscrit(e) le : 22/02/2012

http://arcanes.lacaverneauxgrimoires-forum.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage pour le moins curieux....!

Message par Dr. Karlos le Dim 26 Fév 2012 - 19:51

Re,

Avez-vous bien retiré l'ancien CSS. Wink ?

Vous devez copier le contenu se trouvant dans la fenêtre où vous insérez le code CSS que je vous propose.



Cordialement.

Dr. Karlos
+ Hyperactif +

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

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

Résolu Re: Affichage pour le moins curieux....!

Message par lmc38510 le Dim 26 Fév 2012 - 19:59


Je confirme ancien CSS viré....remplacé par le nouveau...
Option sur toutes les pages "coché"

Précision
1er CSS communiqué:
.headerbar {
background-color: #12A3EB;
background-image: url(http://www.archive-host.com/link/1bfea24ce9acc23ef1c54c888260f551ff248d98.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
margin-bottom: 4px;
padding: 0 5px;
}

2ème CSS :
.headerbar {
background-color: #12A3EB;
background-image: url(http://www.archive-host.com/link/1bfea24ce9acc23ef1c54c888260f551ff248d98.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
margin-bottom: 4px;
padding: 0 5px;
}

Sauf erreur de ma part sont parfaitement identique....!!! Interrog

lmc38510
*****

Masculin
Messages : 532
Inscrit(e) le : 22/02/2012

http://arcanes.lacaverneauxgrimoires-forum.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage pour le moins curieux....!

Message par Dr. Karlos le Dim 26 Fév 2012 - 20:24

Re,

Il me semblait avoir inséré un "w" de trop à quelque part. Avez-vous d'autres codes CSS présents avec "headerbar"?


Cordialement.

Dr. Karlos
+ Hyperactif +

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

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

Résolu Re: Affichage pour le moins curieux....!

Message par lmc38510 le Dim 26 Fév 2012 - 21:25

@Dr. Karlos a écrit:Re,

Il me semblait avoir inséré un "w" de trop à quelque part. Avez-vous d'autres codes CSS présents avec "headerbar"?
Cordialement.

Non aucun... Wink

lmc38510
*****

Masculin
Messages : 532
Inscrit(e) le : 22/02/2012

http://arcanes.lacaverneauxgrimoires-forum.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage pour le moins curieux....!

Message par Dr. Karlos le Dim 26 Fév 2012 - 21:29

Bonsoir,

Essayez avec ce code:
Code:
.headerbar {
background-color: #12A3EB;
background-image: url(http://www.archive-host.com/link/1bfea24ce9acc23ef1c54c888260f551ff248d98.jpg);
background-repeat: repeat-x;
background-size: 100% 100%;
margin-bottom: 4px;
padding: 0 5px;
}

Copiez le code dans l'encadré "CSS".


Cordialement.

Dr. Karlos
+ Hyperactif +

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

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

Résolu Re: Affichage pour le moins curieux....!

Message par lmc38510 le Dim 26 Fév 2012 - 21:34


Merci Dr Karlos .....mais aucun changement...!

suis en train de terminer l'application suite ton tuto....!

lmc38510
*****

Masculin
Messages : 532
Inscrit(e) le : 22/02/2012

http://arcanes.lacaverneauxgrimoires-forum.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage pour le moins curieux....!

Message par lmc38510 le Dim 26 Fév 2012 - 21:45



Je viens doncd'appliquer le "tuto"
http://forum.forumactif.com/t325386-image-de-fond-changeante-selon-la-resolution-du-visiteur

mis en place .....résultat...aucun changement....! mais....

Un détail : quel image faut-il mettre dans affichage-gestion des images-image de fond de page...
compte tenu des CSS appliquées avec le tuto.....?

lmc38510
*****

Masculin
Messages : 532
Inscrit(e) le : 22/02/2012

http://arcanes.lacaverneauxgrimoires-forum.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage pour le moins curieux....!

Message par Dr. Karlos le Dim 26 Fév 2012 - 21:51

Re,

Normalement, l'image présente dans la gestion des images est celle-ci:
http://illiweb.com/fa/empty.gif

Pouvez-vous coller le code ici que vous avez inséré dans la gestion des codes Javascript? Le changement est difficile à voir puisque votre résolution d'écran n'a pas changé. Wink


Cordialement.

Dr. Karlos
+ Hyperactif +

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

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

Résolu Re: Affichage pour le moins curieux....!

Message par lmc38510 le Dim 26 Fév 2012 - 21:55


Le code complet du CSS

$(function(){

var bg= "http://www.archive-host.com/link/adbcf072718483668a9f1b3c129973767a165340.jpg";

if(screen.width < 801) bg="http://www.archive-host.com/link/e350d92357a8680cdf8cc040e871c4f3f91a1630.jpg";
else if(screen.width < 1025) bg="http://www.archive-host.com/link/a17320851dfb4e6d699a0ec5288855af358d5a67.jpg";
else if(screen.width < 1281) bg="http://www.archive-host.com/link/f5536dbd920942f91cb2b5b85a3a638493587767.jpg";
else if(screen.width < 1601) bg="http://www.archive-host.com/link/251cbf3f9a7597e38b0619d795a8a79445d39de6.jpg";

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

});

lmc38510
*****

Masculin
Messages : 532
Inscrit(e) le : 22/02/2012

http://arcanes.lacaverneauxgrimoires-forum.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage pour le moins curieux....!

Message par Dr. Karlos le Dim 26 Fév 2012 - 23:27

Bonsoir,

Insérez-vous bien le code CSS (pour l'image d'en-tête) dans votre panneau d'administration comme ceci?
> PA | Affichage | Images et couleurs | Couleurs | Feuille de style CSS


Et votre hébergeur semble faire défaut pour le code Javascript (image changeante), remplacez l'ancien code se trouvant dans votre panneau d'administration comme ceci:
> PA | Modules | Gestion des codes Javascript

Par celui-ci:
Code:
$(function(){

var bg= "http://i47.servimg.com/u/f47/16/57/66/20/fond2011.jpg";

if(screen.width < 801) bg="http://i47.servimg.com/u/f47/16/57/66/20/fond8011.jpg";
else if(screen.width < 1025) bg="http://i47.servimg.com/u/f47/16/57/66/20/fond1011.jpg";
else if(screen.width < 1281) bg="http://i47.servimg.com/u/f47/16/57/66/20/fond1211.jpg";
else if(screen.width < 1601) bg="http://i47.servimg.com/u/f47/16/57/66/20/fond1611.jpg";

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

});

Tentez aussi de vider le cache et les cookies de votre navigateur et d'essayer sous un autre navigateur. Wink


Cordialement.

Dr. Karlos
+ Hyperactif +

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

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

Résolu Re: Affichage pour le moins curieux....!

Message par lmc38510 le Dim 26 Fév 2012 - 23:58

Grand Merci à toi oooooh DR Karlos... Humour

aucun problème d'affichage sur l'autre ordi....

quel est le code CSS pour que l'image descende en même temps que la page...
Donc modifier celui actuel avec lequel elle est fixe...!
Spoiler:

body{
background-position: top center;
background-repeat: no-repeat;
background-attachment: fixed;
}

par contre sur mon portable résolution 1024 x 768 aucun changement...
affichage identique avant modif du CSS...

Spoiler:


lmc38510
*****

Masculin
Messages : 532
Inscrit(e) le : 22/02/2012

http://arcanes.lacaverneauxgrimoires-forum.com/
lmc38510 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage pour le moins curieux....!

Message par Dr. Karlos le Lun 27 Fév 2012 - 0:52

Bonsoir,

Placez ce code dans votre CSS à la suite du code pour votre en-tête (et non la gestion des codes Javascript Wink):
Code:
body{
background-position: top center;
background-repeat: no-repeat;
background-attachment: scroll;
}

Pour le problème avec l'image changeante, remplacez votre code Javascript par celui-ci, comme mentionné dans mon message précédant:
Code:
$(function(){
 
var bg= "http://i47.servimg.com/u/f47/16/57/66/20/fond2011.jpg";
 
if(screen.width < 801) bg="http://i47.servimg.com/u/f47/16/57/66/20/fond8011.jpg";
else if(screen.width < 1025) bg="http://i47.servimg.com/u/f47/16/57/66/20/fond1011.jpg";
else if(screen.width < 1281) bg="http://i47.servimg.com/u/f47/16/57/66/20/fond1211.jpg";
else if(screen.width < 1601) bg="http://i47.servimg.com/u/f47/16/57/66/20/fond1611.jpg";
 
document.body.style.backgroundImage="url(\""+bg+"\")";
 
});


Cordialement.

Dr. Karlos
+ Hyperactif +

Masculin
Messages : 2623
Inscrit(e) le : 03/01/2012

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

Résolu Re: Affichage pour le moins curieux....!

Message par lmc38510 le Lun 27 Fév 2012 - 1:01

Grand merci "DR Karlos".....tout est rentré dans l'ordre....! impeccable....!!!!

Je te remercie pour ta compétence, surtout pour ta patience... A force de rentrer des infos pour un débutant...ça fini par "bugger"....il faut le temps de digérer tout cela....
Donc encore Thanks et Bravo2 t'es un chef... ok


lmc38510
*****

Masculin
Messages : 532
Inscrit(e) le : 22/02/2012

http://arcanes.lacaverneauxgrimoires-forum.com/
lmc38510 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