Chargement de css

**cmail** · 23/03/2012, 11h40

Sur cette page d'essai , j'aimerais avoir quelques avis sur le chargement des données css.

Quand la mémoire cache du navigateur est vide, le chargement de la page fait apparaître d'abord les "gpControlGraphicScaleText" (en haut à droite de l'API) avec un alignement gauche (aussi avec une font-size spécifique d'abord en 1em, je présume, puis bascule en .7em) avant de se positionner correctement.

1/ Je ne comprends pas bien pourquoi un tel comportement.
2/ Ensuite, je n'arrive pas à corriger ce problème en imposant mes css correctifs inscrites dans CadHL.css.

Certes ce problème apparait en premier chargement, car ensuite (s'il n'y a pas de reset de la mémoire cache) c'est peu visible.

**dgrichard** · 04/04/2012, 21h46

mga_geo a rapporté un problème similaire ...
Je propose que tu charges les CSS OpenLayers et Geoportal "à la main" dans le <head> de la page comme là

**cmail** · 05/04/2012, 10h34

En effet c'est beaucoup mieux, mais plus long naturellement.

1/ Pour diminuer les temps d'accès, j'ai essayé de supprimer les appels à "http://api.ign.fr/geoportail/api/js/1.3/theme/black/...." qui me semblaient superflus mais le problème revient.

2/ En premier je charge donc http://api.ign.fr/geoportail/api/js/...ault/style.css et en dernier (via GeoportalExtended.js) http://api.ign.fr/geoportail/api/js/...rtal/style.css . Redondant mais peut-on éviter le second appel pour diminuer les temps de chargement ?

**dgrichard** · 07/04/2012, 14h16

J'ai du mal à comprendre ce que tu veux faire ...

Grosso modo, l'API charge :

* default/style.css d'OpenLayers (et éventuellement les fix IE6)
* geoportal/style.css de Geoportal (et éventuellement les fix IE6)

((je ne vois donc pas ce que viens faire black dans l'histoire sauf si tu as copié les CSS directement : la page donnée en exemple utilise le thème 'black'))

On peut pré-charger les deux types de CSS pour empêcher l'API de le (re)faire en respectant à tout pris (surtout) les id (si on change les noms des CSS) :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 <!-- include CSS for easying overwriting of styles : -->
<!-- OpenLayers styles : -->
<link id="__OpenLayersCss__" href="http://api.ign.fr/geoportail/api/js/1.3/theme/default/style.css" type="text/css" rel="stylesheet"/>
    <!--[if lte IE 6]>
    <link id="__IE6OpenLayersCss__" href="http://api.ign.fr/geoportail/api/js/1.3/theme/default/ie6-style.css" type="text/css" rel="stylesheet"/> 
<![endif]--> 
<link id="__GeoportalCss__" href="http://api.ign.fr/geoportail/api/js/1.3/theme/geoportal/style.css" type="text/css" rel="stylesheet"/>
<!--[if lte IE 6]>
    <link id="__IE6GeoportalCss__" href="http://api.ign.fr/geoportail/api/js/1.3/theme/geoportal/ie6-style.css" type="text/css" rel="stylesheet"/> 
<![endif]-->

Après, les problèmes de performances seront plus liés à l'application elle-même qu'au temps de chargement des CSS.

**cmail** · 07/04/2012, 15h49

Ta dernière réponse a enlevé mes quelques incompréhensions.

Chargement de css

IGN API Géoportail

Discussions similaires

Partager

Partager