Dimension fenêtre en final

> Tous les forums > Forum des Webmasters

Statut du sujet : NON RESOLU

Super_GEGE

Posté le 07/04/2007 @ 11:13

Astucien

2495 Messages

J'aurais besoin de savoir où se trouvent les paramètres pour diminuer la taille finale des images qui débordent de l'écran. (ou j'attend que tous le monde possède un écran de 22' !!! ). Merci

MON SITE ICI

Le code dessous

//-- <!doctype html public "-//w3c//dtd html 4.0 transitional//en">
HTML
<HEAD>
<TITLE>...</TITLE>
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<STYLE TYPE="text/css">
BODY{
color:#0000f0;
font-size:13px;
font-family:Verdana;
background-color: #000000;
background-image: url(../marbre2.gif);
}
.M1 {color:#0000f0;font-size:13px;font-family:Verdana;text-align:center;}
body,td,th {
color: #CC0000;
}
.Style1 {
color: #FF00FF;
font-size: 50px;
}
#Layer1 {
position:absolute;
left:19px;
top:44px;
width:45px;
height:28px;
z-index:11;
background-color: #FFFF00;
}
#Layer2 {
position:absolute;
left:70px;
top:44px;
width:40px;
height:44px;
z-index:12;
background-color: #CCCCCC;
}
#Layer3 {
position:absolute;
left:116px;
top:44px;
width:40px;
height:44px;
z-index:13;
background-color: #CCCCCC;
}
.Style3 {font-size: 36px; font-weight: bold; }
#Layer4 {
position:absolute;
left:163px;
top:44px;
width:40px;
height:44px;
z-index:14;
background-color: #CCCCCC;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
a:active {
text-decoration: none;
}
#Layer5 {
position:absolute;
left:331px;
top:108px;
width:1003px;
height:737px;
z-index:1;
}
#Layer6 {
position:absolute;
left:244px;
top:190px;
width:537px;
height:645px;
z-index:0;
}
#Layer7 {
position:absolute;
left:732px;
top:79px;
width:331px;
height:647px;
z-index:1;
}
#Layer8 {
position:absolute;
left:652px;
top:196px;
width:192px;
height:149px;
z-index:3;
}
#Layer9 {
position:absolute;
left:868px;
top:588px;
width:130px;
height:73px;
z-index:15;
}
#Layer10 {
position:absolute;
left:1149px;
top:76px;
width:33px;
height:821px;
z-index:16;
background-color: #000000;
}
#Layer11 {
position:absolute;
left:242px;
top:835px;
width:926px;
height:26px;
z-index:17;
background-color: #000000;
}
</STYLE>
<script language="JavaScript">
var L_Deb;
var L_Fin;
var H_Deb;
var H_Fin;
var Compteur;
var Trame = 10;
var Delay = 100;
var DelayAuto = 1000;
var ModeAuto = false;
var ZoomImg;
var ZoomDiv;
var ID_Timer =0;
var Rap = new Point();
var Inc = new Point();
var Pos = new Point();
var PosFin = new Point();
var PosDeb = new Point();
var ImgTmp = new Image();
// Merçi la compatibilité
var DOM = (document.getElementById ? true : false);
var IE = (document.all && !DOM ? true : false);
var NS4 = (document.layers ? true : false);
var NAV_OK = ( DOM || IE || NS4);
var NETSCAPE = (navigator.appName == "Netscape");

//--------------------
function Point(x_, y_){
var Arg = arguments;
this.x = 0; this.y = 0;
if( Arg[1] != null) this.x = x_;
if( Arg[2] != null) this.y = y_;
}
//---------------------
function GetObjet(div_){
if( DOM) return document.getElementById(div_);
if( IE) return document.all[div_];
if( NS4) return document.layers[div_];
return(null);
}
//---------------------
function GetStyle(div_){
return (NS4 ? GetObjet(div_) : GetObjet(div_).style);
}
//------------------------
function ObjGetPosX( div_){
var Obj = null;
if( div_){
Obj = GetObjet( div_);
if( Obj)
return (NS4 ? Obj.pageX : Obj.offsetLeft);
}
return(null);
}
//------------------------
function ObjGetPosY( div_){
var Obj = null;
if( div_){
Obj = GetObjet( div_);
if( Obj)
return (NS4 ? Obj.pageY : Obj.offsetTop);
}
return(null);
}
//-----------------------------
function ObjWrite( div_, html_){
var Obj;
Obj = GetObjet( div_);
if( Obj) with( Obj){
if( !NS4){
innerHTML = html_;
}
else{
document.open();
document.write( html_);
document.close();
}
}
}
//---------------------------
function ObjGetLargeur( div_){
var Obj = null;
var Larg = 0;
Obj = GetObjet( div_);
if( Obj){
if( NETSCAPE){
if( NS4)
Larg= Obj.clip.width;
else
Larg= Obj.offsetWidth;
}
else
Larg= Obj.scrollWidth;
}
return( Larg);
}
//---------------------------
function ObjGetHauteur( div_){
var Obj = null;
var Haut = 0;
Obj = GetObjet( div_);
if( Obj){
if( NETSCAPE){
if( NS4)
Haut= Obj.clip.height;
else
Haut= Obj.offsetHeight;
}
else
Haut= Obj.scrollHeight;
}
return( Haut);
}
//-------------------------------
function ObjMoveTo( div_, x_, y_){
var Obj = null;
var Arg = arguments;
if( div_){
Obj = GetStyle( div_);
if( Obj){
if( NETSCAPE){
if( Arg[1] != null) Obj.left = x_;
if( Arg[2] != null) Obj.top = y_;
}
else{
if( Arg[1] != null) Obj.pixelLeft = x_;
if( Arg[2] != null) Obj.pixelTop = y_;
}
}
}
}
//---------------------
function ObjHide( div_){
var Obj = null;
if( div_){
Obj = GetStyle( div_);
if( Obj){
Obj.visibility= "hidden";
Obj.zIndex = 0;
}
}
return(true);
}
//-------------------------
function ObjShow( div_, z_){
var Obj = null;
if( div_){
Obj = GetStyle( div_);
if( Obj){
Obj.visibility = "visible";
if( arguments[1] != null)
Obj.zIndex = z_;
else
Obj.zIndex = 1;
}
}
return(true);
}
//-----------------------------
function ObjWrite( div_, html_){
var Obj;
Obj = GetObjet( div_);
if( Obj) with( Obj){
if( !NS4){
innerHTML = html_;
}
else{
document.open();
document.write( html_);
document.close();
}
}
}
//-----------------
function ZoomMoins(){
var Larg;
var Haut;
var Html ="";
Compteur--;

//-- Calcul nouveaux paramètres --
Pos.x = PosDeb.x +parseInt( Compteur *Inc.x);
Pos.y = PosDeb.y +parseInt( Compteur *Inc.y);
Larg = L_Deb +parseInt( Compteur *Rap.x);
Haut = H_Deb +parseInt( Compteur *Rap.y);

Html = '<TABLE BORDER=1 BGCOLOR="#ffffff"><TR><TD><IMG SRC="' +ZoomImg +'" HEIGHT='+ Haut +' WIDTH=' +Larg +'></TD></TR></TABLE>';
ObjWrite ( ZoomDiv, Html);
ObjMoveTo( ZoomDiv, Pos.x, Pos.y);

if( Larg > L_Deb)
ID_Timer = setTimeout( ZoomMoins, Delay);
else{
ObjHide ( ZoomDiv);
ObjWrite ( ZoomDiv,"");
}
}
//-----------------------
function StartZoomMoins(){
clearTimeout(ID_Timer);
ZoomMoins();
}
//-----------------
function ZoomPlus(){
var Larg;
var Haut;
var Html ="";
var Text ="";
Compteur++;

Html = '<TABLE BORDER=1 BGCOLOR="#000000"><TR><TD><IMG SRC="' +ZoomImg +'" HEIGHT='+ Haut +' WIDTH=' +Larg +'></TD></TR></TABLE>';
ObjWrite ( ZoomDiv, Html);
ObjMoveTo( ZoomDiv, Pos.x, Pos.y);
ObjShow ( ZoomDiv, 1);

if( Larg < L_Fin -1)
ID_Timer = setTimeout( ZoomPlus, Delay);
else{
Text = '<IMG SRC="' +ZoomImg +'" border=0 ALT="Retour case départ...">';
if( !ModeAuto)
Html = '<TABLE BORDER=1 BGCOLOR="#ffffff"><TR><TD><a href="#" Onclick="StartZoomMoins()";>'+ Text +'</a></TD></TR></TABLE>';
else
Html = '<TABLE BORDER=1 BGCOLOR="#ffffff"><TR><TD>'+ Text +'</TD></TR></TABLE>';
ObjWrite ( ZoomDiv, Html);
ObjMoveTo( ZoomDiv, PosFin.x, PosFin.y);
window.status ="FIN";
if( ModeAuto)
ID_Timer= setTimeout( StartZoomMoins, DelayAuto);
}
}
//---------------------------------
function StartZoomPlus( div_, url_){
ZoomImg = url_;
ZoomDiv = div_;
clearTimeout(ID_Timer);
ZoomPlus();
}
//------------------
function GetPosFin(){
var Larg;
var Haut;

//-- Récup Position Image Finale --
Larg = ObjGetLargeur( 'FINAL');
Haut = ObjGetHauteur( 'FINAL');
PosFin.x = ObjGetPosX( 'FINAL') +Larg /2;
PosFin.y = ObjGetPosY( 'FINAL') +Haut /2;

//-- Tiens compte de la largeur du cadre
PosFin.x -= -800;
PosFin.y -= -400;
}
//------------------------------
function StartImage( div_, url_){
var Html ="";
ImgTmp.src = url_;
Compteur=0;

//-- Création Image dans DIV caché --
Html = '<IMG NAME="Result" ID="Result" SRC="' +url_ +'">';
ObjHide ( 'Temp');
ObjWrite ( 'Temp', Html);

//-- Récup Position Image Finale --
GetPosFin();

//-- Récup Position Image Départ --
PosDeb.x = ObjGetPosX( div_ );
PosDeb.y = ObjGetPosY( div_);

//-- Récup Taille Image Départ --
L_Deb = ObjGetLargeur( div_);
H_Deb = ObjGetHauteur( div_);

//-- Récup. taille Image Finale --
L_Fin = ObjGetLargeur( 'Temp');
H_Fin = ObjGetHauteur( 'Temp');
PosFin.x -= L_Fin/2;
PosFin.y -= H_Fin/2;

//-- Calcul paramètres déplacement --
Rap.x = (L_Fin - L_Deb) / Trame;
Rap.y = (H_Fin - H_Deb) / Trame;
Inc.x = (PosFin.x - PosDeb.x) / Trame;
Inc.y = (PosFin.y - PosDeb.y) / Trame;

//-- Lance le Zoom --
StartZoomPlus( 'Temp', url_);

}
</script>
</HEAD>
<BODY>
<div id="Layer1">
<div align="center" class="Style3">1</div>
</div>
<div id="Layer2">
<div align="center" class="Style3"><a href="page_vignettes_2.html">2</a></div>
</div>
<div id="Layer3">
<div align="center" class="Style3"><a href="page_vignettes_3.html">3</a></div>
</div>
<div class="Style3" id="Layer4">
<div align="center"><a href="page_vignettes_4.html">4</a></div>
</div>
<div id="Layer6">
<div align="center"><img src="../michel_ange_partg.gif" width="698" height="643" align="absmiddle"></div>
</div>
<div id="Layer7"><img src="../michel_ange_partd.gif" width="415" height="616"></div>
<div id="Layer9"><img src="../bruno_artiste.gif" width="111" height="50"></div>
<div id="Layer11"></div>
<div align="center">
<h1 class="Style1"><img src="../titre.gif" width="711" height="86"></h1>
</div>
<div ID="Temp" style="position:absolute;left:0px;top:0px;width:auto;height:auto;z-index:0;visibility:visible;">
<table widh=200><tr><td></td></tr></table>
</div>

</BODY>
</HTML>

Publicité

Dreamer

Posté le 07/04/2007 à 11:29

Astucien

4407 Messages

Bonjour

Je viens de regarder et ..............je crois que tu devrais reprendre un peu ton site .

Ton image en background est trop grande et répetée ...beaucoup d'effets qui se finissent sur les cotés .

Puis-je en toute modestie te proposer un truc sympa , qui s'appelle lightbox , qui te permettrais de faire quelque chose de bien .

Un exemple sur mon blog : test cliques sur une des images de la chatte et tu verras l'effet ( on peut mettre du texte ) , c'est très simple a installer .

Si ça t'interesse , je peux t'aider .

A +

Super_GEGE

Posté le 07/04/2007 à 11:51

Astucien

2495 Messages

Merci de ta réponse.

Avec un écran de 22', j'ai tendance à voir les chose en trop grand !!! .

Pour mon image de fond trop grande 280 X 281 (9 Ko) répétée, c'est normal, ar, si elle est plus petite, on perd l'effet de marbre et, avec les débit internet actuels, le ralentissement est peu génant.

Pour l'image qui déborde, c'est justement le sujet de ma question, je cherche à en diminuer la taille.

Je sais comment changer sa position finale mais pas la taille.

J'ai essayé de cliquer sur ton chat mais, je n'ai rien vu de particulier ???, juste une grande page blanche avec la photo ??? et un rond ou étoile ??? fugace.

Ton Diaporama n'est pas mal mais, je regrette qu'en cliquant dessus, l'on soit dirigé vers le site d'hébergement. J'ai un logiciel qui génère de Superbes Diaporamas comme je le voudrais, malheureusement, j'ai du l'abandonner car, il nécessite le téléchargement d'un plugin, ce qui fait hésiter pas mal de gens à l'installer.

Le Diaporama étant sur internet et l'exécution se faisant directement sur l'ordi le fichier généré est Super petit ce qui permet des images de qualité. C'est dommage car, question rapidité, c'était génial.

Le javascrip que j'ai adapté sur le site me convient tout à fait. C'est pour cela que je cherche uniquement à le modifier.

Je rechercherais plus tard une autre méthode pour créer une page avec un Diaporama du style de proshow mais sans plugin cette fois.

Modifié par Super_GEGE le 07/04/2007 11:54

Dreamer

Posté le 07/04/2007 à 12:04

Astucien

4407 Messages

Salut

Je suis en train de te preparer un exemple à partir de ton site , tu l'auras dans l'après midi , tu pourras mieux comparer .

Je suis étonné que tu n'ais pas l'effet lightbox , à moins que tu ais désactiver les popup ?

A +

Super_GEGE

Posté le 07/04/2007 à 12:43

Astucien

2495 Messages

comme tous les informaticiens, je répare les ordi des autres et, je n'ai pas le courage pour le mien

J'ai pas mal de problèmes insolubles sans une réinstall. Cela peut venir de là. surtout s'il faut flash player qu'il m'est impossible d'installer et direct X en a pris un coup lui aussi

Faudra que j'essaye sur un autre disque dur mais, ils ne sont guère mieux

en tout cas, merci de ton aide

Dreamer

Posté le 07/04/2007 à 12:56

Astucien

4407 Messages

Super_GEGE a écrit :

comme tous les informaticiens, je répare les ordi des autres et, je n'ai pas le courage pour le mien
J'ai pas mal de problèmes insolubles sans une réinstall. Cela peut venir de là. surtout s'il faut flash player qu'il m'est impossible d'installer et direct X en a pris un coup lui aussi

Faudra que j'essaye sur un autre disque dur mais, ils ne sont guère mieux

en tout cas, merci de ton aide

Super_GEGE

Posté le 07/04/2007 à 13:33

Astucien

2495 Messages

Ca y est, j'ai vu ton anim. En fait, c'est un peu la même que moi sans le déplacement. Il faudrait y adapter le principe d'ouverture et de fermeture automatique comme sur mon site.

Par contre, je viens de rajouter un effet d'ouverture sympa du style de ta photo mais pour tout le site.

L'effet ouvre une seconde page mais, je pense savoir comment résoudre le problème.

Modifié par Super_GEGE le 07/04/2007 13:35

Dreamer

Posté le 07/04/2007 à 17:05

Astucien

4407 Messages

salut

Pourquoi veux-tu ouverture et fermeture automatique ?

Si la personne veux bien examiner le tableau , il faut lui laisser le temps et lui laisser le choix pour la fermeture du popup , non ?

Je viens de rentrer , je finis vite mon test et je te montre ...

A +

Dreamer

Posté le 07/04/2007 à 17:33

Astucien

4407 Messages

Re-bonjour

J'ai fait un truc à la louche pour te montrer : ici , pour les faire partir les popups , soit tu cliques sur la croix soit sur la photo ...

Ca peut-être une bonne base pour tes tableaux .

A +

Dreamer

Posté le 07/04/2007 à 17:36

Astucien

4407 Messages

Dreamer a écrit :

Re-bonjour

J'ai fait un truc à la louche pour te montrer : ici , pour les faire partir les popups , soit tu cliques sur la croix soit sur la photo ...

Ca peut-être une bonne base pour tes tableaux .

A +

Ps: j'ai du retailler tes images pour qu'elles logent dans un 800x600 ( faut penser à eux aussi )

elle

Posté le 07/04/2007 à 19:10

Maîtresse astucienne

16247 Messages

Salut Super_gg,

Deux petites choses : rien à voir avec la taille de ton écran, mais bien avec la résolution choisie (tu devrais pouvoir afficher en 800 x 600) et si JS est désactivé, on ne voit rien du tout, même pas une image qui ouvrirait dans une autre fenêtre comme c'est le cas pour la plupart des scripts JS de ce genre ...

Modifié par elle le 07/04/2007 19:11

elle

Posté le 07/04/2007 à 19:13

Maîtresse astucienne

16247 Messages

Avec le script de Dreamer (

), on peut cependant voir l'image même si JS est désactivé...

Super_GEGE

Posté le 07/04/2007 à 19:16

Astucien

2495 Messages

Merci Elle, j'étais justement en train d'écrire.

Son script est vraimment Super. L'effet d'assombrissement est une excellente idée.

Juste un détail, j'aimerais bien sans le message "pour fermer....cliquer sur la croix", je pense que c'est inutile car, on voit vite qu'un clic n'importe où suffiit".

si tu peux modifier le script en ce sens, je l'incorporerais à mes pages en remplacement de celui que j'ai actuellement.

Modifié par Super_GEGE le 07/04/2007 19:23

Dreamer

Posté le 07/04/2007 à 19:32

Astucien

4407 Messages

Salut

Si tu veux le code ........sinon pour enlever la phrase qui te gêne , c'est à la fin du js .

A +

Super_GEGE

Posté le 07/04/2007 à 19:39

Astucien

2495 Messages

J'ai fais un tour sur ton site, il est Superbe, dommage que mon navigateur plante 9 fois sur 10 sur la 1ère page mais, j'ai pu naviguer un peu. Tu as fais un sacré travail !!!

Super_GEGE

Posté le 07/04/2007 à 19:41

Astucien

2495 Messages

je veux bien ton code, je t'envoie mon adresse par MP.

Merci

Dreamer

Posté le 07/04/2007 à 19:42

Astucien

4407 Messages

Oui , et c'est en perpétuelle évolution .......toujours des améliorations !!!

Je t'envoie le dossier ou pas ? ( à moins que tu ais Web developer , donc récup des fichiers )

A +

Super_GEGE

Posté le 07/04/2007 à 19:55

Astucien

2495 Messages

je t'ai envoyé un message

Inscrivez-vous !

- Posez vos questions

- Résolvez vos problèmes

- Aidez les autres

- Participez et créez vos discussions

- Dialoguez en privé avec d'autres membres

- Suivez vos sujets préférés

- Affichez les signatures des membres

TOUT EST GRATUIT !

Je crée mon compte

Vous avez besoin d'aide ?

Des centaines d'experts sont à votre disposition sur les forums PC Astuces pour vous aider gratuitement, 24h/24, 7j/7.

> Tous les forums > Forum des Webmasters

Forum PC Astuces