|
|
|
|
||||||
![]() |
|
|
LinkBack | Outils de la discussion |
|
|
#1 |
|
Messages: n/a
Hébergeur: |
Bonjour,
Soit cette esquisse: http://www.rovahotel.com/ Mon souci est au sujet du "gros" background du coté droit. Il met trop de temps à s'afficher. J'ai bien regardé du coté des solutions de préchargement des images, mais manifestement, elles ne concernent que les images destinées à être affichées comme du contenu (pas juste du background). Auriez vous une idée de comment je dois procéder pour précharger cette image qui est un background? J'ai cependant quelques contraintes: J'ai mis trop de temps à positionner à la main et aux CSS cet ensemble (et encore c'est crade, j'ai un height fixé à la dure, etc...). Donc, pas facile de faire un petit truc de 1px par 1px quelquepart pour précharger. Je veux bien utiliser du Javascript, mais j'ai épuisé mes ressources à en chercher un fonctionnerai avec des backgrounds. Merci d'avance pour toute indication. -- Huile Essentielle de Camphre http://www.huile-camphre.fr Infogerance http://www.infogerance.us (Serveurs, Postes de travail, Développement logiciel) |
|
|
|
#2 |
|
Messages: n/a
Hébergeur: |
Mihamina Rakotomandimby a écrit :
> Bonjour, > Soit cette esquisse: http://www.rovahotel.com/ > Mon souci est au sujet du "gros" background du coté droit. > > Il met trop de temps à s'afficher. Il faut donc remanier cette image le plus urgemment possible ! Soit en JPEG à 50% ou mieux 25% Soit en PNG bien boosté > J'ai bien regardé du coté des solutions de préchargement des images, > mais manifestement, elles ne concernent que les images destinées à être > affichées comme du contenu (pas juste du background). > > Auriez vous une idée de comment je dois procéder pour précharger cette > image qui est un background? Je crois que tu confonds pré-chargement et post-chargement, non ? Le pré-chargement signifie qu'on chagre des trucs (dans le cache) avant d'afficher la page, c'est ce que tu veux ? qu'on attende devant une page blanche ? Le post-chargement consiste à afficher la page allégée, puis au onload (à l'ouverture, une fois chargée et probablement affichée) on lance un JavaScript pour compléter. > J'ai cependant quelques contraintes: > J'ai mis trop de temps à positionner à la main et aux CSS cet ensemble > (et encore c'est crade, j'ai un height fixé à la dure, etc...). Donc, > pas facile de faire un petit truc de 1px par 1px quelquepart pour > précharger. Je vois pas le rapport ... Ton truc ça y est tu l'as fait (cradement dis-tu, ce qui n'est guère étonnant : s'il faut mettre des dimensions extra précises et contrer la façon naturelle d'organisation des boites stylées ou que le positionnement en absolute est requis à peu près partout c'est qu'on a merdé tout au long de l'exercice) donc de post-pré-charger ne changera rien. Je comprends pas cette histoire de 1px pour "pré-charger" ... ? On n'a pas besoin d'un emplacement dans la page pour post ou pré charger une image en JS. (y a un cache pour ça) Après, une fois qu'on a l'image il n'y a rien de plus facile pour la mettre en background de ce qu'on veut. On peut même la mettre sans rien pré-charger : document.getElementById('monDiv').style.background Image='url(photo.jpg)'; > Je veux bien utiliser du Javascript, mais j'ai épuisé mes ressources à > en chercher un fonctionnerai avec des backgrounds. c'est paske tu as très mal cherché. Le post-chargement est hyper simple à faire : CSS : ..back_1 { url(tres_grande_gauche.png) no-repeat center left; } #ici_1 { position:absolute; right: 0; top: 125px; height: 213px; width: 367px} HTML : <div id="ici_1"></div> JS : function $(id) { return.document.getElementById(id); } window.onload = function() { $('ici').className = 'back_1'; $('ailleurs').className = 'back_2'; // etc pour les autres trucs à styler après coup } > Merci d'avance pour toute indication. Comment ça fonctionne : - la Feuille de Style est lue par le brouteur - au fur et à mesure qu'il lit le reste du fichier il applique les règles CSS et lorsqu'une image intervient dans la règle il charge alors l'image (ou se sert de celle en cache) - les trucs et bidules n'ont pas d'image de background quand le fichier est chargé donc le brouteur ne les charge pas ça va vite. - après chargement (onload) et affichage on colle des class aux trucs et bidules. Ces class comporte des images, elle ne sont alors chargées que maintenant. Pendant qu'elles se chargent le visiteur peut tenter de découvrir et commencer à lire la page. Bon ... petite surprise quand il va voir ces fonds s'afficher et lui brouiller la vue. Du moins s'il n'a pas sauté ailleurs dans l'intermède. -- sm |
|
|
|
#3 |
|
Messages: n/a
Hébergeur: |
Bonjour,
> Il met trop de temps à s'afficher. > J'ai bien regardé du coté des solutions de préchargement des images, mais > manifestement, elles ne concernent que les images destinées à être > affichées comme du contenu (pas juste du background). Chez moi pas de problème de temps de chargement, je suis en Adsl 1 Mo. J'aurais bien du mal à donner des conseils de conception de page. Mais ce que je constate c'est qu'avec IE7 la page est décalée sur la droite. J'ai un grand vide blanc sur la gauche, obligé d'utiliser l'ascenseur horizontal pour centrer la page. Dans contact l'adresse mail est lisible en clair dans la page, attention au spam. > Merci d'avance pour toute indication. Désolé de ne pas être tout à fait dans le sujet mais je fais selon mes possibilités. > Auriez vous une idée de comment je dois procéder pour précharger cette > image qui est un background? J'aurais moi peut-être essayé de faire deux images séparées au lieu d'une grosse en laissant la partie en bas à droite pour du texte. Mais franchement de l'idée à la réalisation pour moi aussi c'est pas gagné ! Cordialement -- Alain |
|
|
|
#4 |
|
Messages: n/a
Hébergeur: |
Mihamina Rakotomandimby a écrit :
> Bonjour, > Soit cette esquisse: http://www.rovahotel.com/ C'est curieux ce choix sans lien HTML avec un menu ne fonctionnant qu'en javascript. > Mon souci est au sujet du "gros" background du coté droit. Oui ... 700ko ... mon soft le passe à 650 mais en JPEG il ne fait plus que 67 ko Ça ne pourrait pas suffire au design du site ce jpg ? > Il met trop de temps à s'afficher. Je n'ai pu juger ... c'est arrivé tt de suite. Ou bien j'avais déjà vu, ou bien l'ADSL ça marche bien :-) > J'ai bien regardé du coté des solutions de préchargement des images, curieusement le menu s'est affiché par à coup, un titre après l'autre avec un petit délai entre chaque. Je n'ai pas regardé le JS, c'est peut-être un effet voulu. > J'ai mis trop de temps à positionner à la main et aux CSS cet ensemble Je ne comprends pas bien que pour la partie gauche tu aies réussi à maquetter avec des bouts d'images et que tu n'aies pas fait pareil à droite. Niveau "accessibilité" tout est fait pour aller à l'encontre de cette notion. -- sm |
|
|
|
#5 |
|
Messages: n/a
Hébergeur: |
SAM wrote:
> Je ne comprends pas bien que pour la partie gauche tu aies réussi à > maquetter avec des bouts d'images et que tu n'aies pas fait pareil à > droite. Les bouts d'images ont été faits par mon collègue. Je voulais faire du multicolumn avec du CSS. Mon collègue m'a dit d'aller en tableau, moi je me suis enteté en CSS. Le problème c'est que ça a pris plus de temps que prévu alors j'ai fait au plus vite pour pas plomber l'équipe. On peauffinera plus tard... -- Huile Essentielle de Camphre http://www.huile-camphre.fr Infogerance http://www.infogerance.us (Serveurs, Postes de travail, Développement logiciel) |
|
|
|
#6 |
|
Messages: n/a
Hébergeur: |
Mihamina Rakotomandimby a écrit :
> SAM wrote: >> Je ne comprends pas bien que pour la partie gauche tu aies réussi à >> maquetter avec des bouts d'images et que tu n'aies pas fait pareil à >> droite. > > Les bouts d'images ont été faits par mon collègue. Où sont celles pour la droite ? (haut-droite, droite, bas-droite) Normalement et si tu restes en largeur fixe centrée tu ne devrais avoir besoin que de 3 images : haut, centre (2 à 5px de haut), bas. C'est hyper simple à faire. > Je voulais faire du multicolumn avec du CSS. > Mon collègue m'a dit d'aller en tableau, moi je me suis enteté en CSS. > > Le problème c'est que ça a pris plus de temps que prévu alors j'ai fait > au plus vite pour pas plomber l'équipe. > On peauffinera plus tard... alors passe ton image en jpg et hop ! Côté peaufinage faudra revoir le menu : - vrais liens - image de background en "portes coulissantes" (voir Google) -- sm |
|
|
|
#7 |
|
Messages: n/a
Hébergeur: |
Mihamina Rakotomandimby a écrit :
> Bonjour, > Soit cette esquisse: http://www.rovahotel.com/ > Mon souci est au sujet du "gros" background du coté droit. voir : <http://stephane.moriaux.pagesperso-orange.fr/truc/ROVAH/> > Merci d'avance pour toute indication. Trop à faire pour les indications ... -- sm |
|
|
|
#8 |
|
Messages: n/a
Hébergeur: |
SAM wrote:
> http://stephane.moriaux.pagesperso-o...fr/truc/ROVAH/ Merci beaucoup. -- Huile Essentielle de Camphre http://www.huile-camphre.fr Infogerance http://www.infogerance.us (Serveurs, Postes de travail, Développement logiciel) |
|
![]() |
| Outils de la discussion | |
|
|