Discussion :

[hm7845]

Bonjour,

J'ai pris modèle sur l'exemple changements de l'affichage et j'arrive à ce code qui est encore à perfectionner, mais qui fonctionne plutôt bien :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
    .gpControlLayerSwitcher .gpLayersClass .gpControlLabelClass {
        background-color:#004387;
        border-color:#C0C0C0;
    }
    .gpLayerDivClass .gpLayerNameGroupDivClass {
        background-color:#f3efe9;
    }
    .gpLayerDivClassAlternate .gpLayerNameGroupDivClass {
        background-color:#fff6e4;
    }
    .gpToolBoxClass .gpControlLabelClass {
        background-color:#004387;
        border-color:red;
    }
    .gpToolBoxClass .gpToolBoxContentContainer div.gpToolBoxContent {
        background-color:white;
        border-color:white;
    }
    .gpToolBoxClass .gpControlLabelClass center {
        color:red;
    }
    .gpControlNavToolbar {
        background-color:#f3efe9;
    }
    .gpZoomBarClass {
        background-color:#f3efe9;
    }
    .gpMainMapCell {
        border:1px solid #C0C0C0;
    }
    .gpControlInformation {
        background: #f3efe9 none;
    }
    .gpControlInformationMini {
        background-image:url(minimized-up_cg.gif);
    }
    .gpSelectProjections, .gpSelectUnits {
        background-color:#f3efe9;
        border-color:#C0C0C0;
    }
    .gpLong, .gpLat {
        background-color:#f3efe9;
    }
    .gpPopup .gpPopupContent {
        background-color:#f3efe9;
        padding:1px;
        margin:1px;
    }
    div#viewerDiv {
        font-size:medium;
        width:720px;
        height:600px;
        background-color:white;
        background-image:url(http://api.ign.fr/geoportail/api/js/1.2/theme/geoportal/img/loading.gif);
        background-position:center center;
        background-repeat:no-repeat;
    }

Mais il y a un petit défaut.

La bordure de la barre de zoom ne s'affiche pas sur le côté droit du contrôle, y compris dans l'exemple changements de l'affichage que j'ai pris pour modèle. J'ai mis la bordure en blanc pour ça se voie moins. Y-a-t-il un meilleur moyen pour y remédier ?

[dgrichard]

La bordure de la barre de zoom ne s'affiche pas sur le côté droit du contrôle, y compris dans l'exemple changements de l'affichage que j'ai pris pour modèle. J'ai mis la bordure en blanc pour ça se voie moins. Y-a-t-il un meilleur moyen pour y remédier ?

Si je comprend bien la question :

Code :

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

1
2
3
4
5
6
.gpZoomBarClass {
   background-color:#f3efe9;
   padding-left: 1px;
   padding-top: 1px;
}

Comme d'habitude, sous FF, un petit coup de Firebug

[hm7845]

Super, merci !

J'ai mis le côté gauche à 0px et ça marche super. Bien sûr, je bidouille sans y comprendre grand chose.

Avec ce code :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
    .gpToolBoxClass .gpToolBoxContentContainer div.gpToolBoxContent {
        background-color:white;
        border-color:black;
    }
    .gpToolBoxClass .gpControlLabelClass center {
        color:red;
    }
    .gpControlNavToolbar {
        background-color:#f3efe9;
    }
    .gpZoomBarClass {
        background-color:#f3efe9;
        padding-left: 0px;
        padding-top: 1px;
    }

J'obtiens maintenant ceci :



J'ai tellement de choses à apprendre, y compris sûrement découvrir Firebug.