Image aleatoire + lien automatique vers l'image taille réelle et .....

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Image aleatoire + lien automatique vers l'image taille réelle et .....

magiclazy

citation personnelle associé

BOnjour !

Je connais les générateurs de galeries d'images avec les quelles on a une preview puis apres un clique on a la photo taille réelle
mais ce que je voudrais c'est SA ! + pouvoir les mettrent (les preview clicables) en images aléatoire dans un carre de 100*150 px sur chaqu'une de me pages ...
voila pas facile tout sa

merci d'avance !!!!

Publicité

xtof_83

Freeride Spirit

Ouais lol, que veut qu'on te dise ...oui c'est possible..

Avec du php ou autre langages serveurs.

magiclazy

citation personnelle associé

ben enfaite c pour savoir comment faire j'y connais rien alors ....

xtof_83

Freeride Spirit

Ben ici on est pas là pour donner du code tout fais si le gars n'y connais rien

Donc soit tu t'y met...soit va voir sur google pour trouver des truc tout fais

magiclazy

citation personnelle associé

ok merci quand même ...

magiclazy

citation personnelle associé

Code :

<script language="javascript">
<!--
function Xander_Popup(file,image_width,image_height,popup_width,popup_height,adapt_image,allow_full_size,bgcolor,textcolor,comments,comments_mode)
{
if (!comments)
comments = "";
if (!comments_mode)
comments_mode = 0;
var sWidth = screen.availWidth;
var sHeight = screen.availHeight;
if (!sWidth)
sWidth = screen.width;
if (!sHeight)
sHeight = screen.height;
IsFullScreen = 0;
additionnal_margin_for_comment = 0;
if (comments_mode == 3)
additionnal_margin_for_comment = 20;
if (popup_width > 0)
{
if (popup_width < 100) popup_width = 100;
if (popup_height < 100) popup_height = 100;
if (popup_width > (sWidth - 30)) popup_width = sWidth - 30;
if (popup_height > (sHeight - 30)) popup_height = sHeight - 30;
}
if (popup_width == -1)
{
if ((image_width > (sWidth - 30)) || (image_height > (sHeight - 30 - additionnal_margin_for_comment)))
{
if (!adapt_image)
{
lwidth = image_width; lheight = image_height;
do { lwidth = lwidth * 0.9; } while (lwidth > (sWidth - 30));
do { lheight = lheight * 0.9; } while (lheight > (sHeight - 30 - additionnal_margin_for_comment));
}
else
{
lwidth = image_width; lheight = image_height;
do { lwidth = lwidth * 0.9; lheight = lheight * 0.9; } while ((lwidth > (sWidth - 30)) || (lheight > (sHeight - 30 - additionnal_margin_for_comment)));
}
popup_width = lwidth; popup_height = lheight + additionnal_margin_for_comment;
if (adapt_image && allow_full_size) popup_width = popup_width + 13;
}
else
{ popup_width = image_width; popup_height = image_height + additionnal_margin_for_comment; }
}
if (popup_width >= 0)
{
if (popup_width < 100) popup_width = 100;
if (popup_height < 100) popup_height = 100;
}
if (popup_width < 0)
{
IsFullScreen = 1;
if (navigator.appName.substring(0,9) == 'Microsoft')
{
sWidth = screen.width;
sHeight = screen.height;
}
else
{
sHeight = sHeight - 25; // for browsers other than IE : title bar space
}
popup_width = sWidth-16; // fullscreen has always toolbars ?...
popup_height = sHeight - 20 - additionnal_margin_for_comment; // leave place for close link and comment...
if ((popup_width < image_width) || (popup_height < image_height))
image_reduced = true;
else image_reduced = false;
pop = window.open("","","fullscreen=yes, width="+sWidth+", height="+sHeight+", left=0, top=0, resizable=yes, scrollbars=no,menu=no,menubars=no,status=no,directories=no,location=no,toolbar=no" );
}
else
{
if ((popup_width < image_width) || ((popup_height - additionnal_margin_for_comment) < image_height))
image_reduced = true;
else image_reduced = false;
var top = (sHeight - popup_height - 25) / 2;
var left = (sWidth - popup_width - 4) / 2;
if ((!image_reduced) || (image_reduced && adapt_image && !allow_full_size))
pop = window.open("","","width="+popup_width+", height="+popup_height+",top="+top+",left="+left+",resizable=no, scrollbars=no,menu=no,menubars=no,status=no,directories=no,location=no,toolbar=no" );
else pop = window.open("","","width="+popup_width+", height="+popup_height+", top="+top+", left="+left+", resizable=yes, scrollbars=yes,menu=no,menubars=no,status=no,directories=no,location=no,toolbar=no" );
}
pop.window.document.write("<HTML><HEAD><TITLE>Zoom de l'image</TITLE></HEAD><BODY bgcolor='"+bgcolor+"', style=\"margin: 0px; padding: 0px;" );
if (IsFullScreen && ((adapt_image && !allow_full_size) || !image_reduced))
pop.window.document.write("scrollbar-base-color:"+bgcolor+"; scrollbar-highlight-color:"+bgcolor+"; scrollbar-shadow-color:"+bgcolor+"; scrollbar-face-color:"+bgcolor+"; scrollbar-arrow-color:"+bgcolor+";scrollbar-track-color: "+bgcolor+";scrollbar-3dlight-color: "+bgcolor+"; scrollbar-darkshadow-color: "+bgcolor+";" );
pop.window.document.write("\">" );
if (comments_mode == 2)
{
pop.window.document.write("<style type=\"text/css\">\n<!-" );
pop.window.document.write("- \n.popperlink {position:absolute;visibility:hidden}\n-" );
pop.window.document.write("-" );
pop.window.document.write(">\n</style><div class=popperlink id=topdecklink></div><script language=\"javascript\">domok = document.getElementById;if (domok){ skn = document.getElementById(\"topdecklink\" ).style; if(navigator.appName.substring(0,3) == \"Net\" ) document.captureEvents(Event.MOUSEMOVE); document.onmousemove = get_mouse; }" );
pop.window.document.write("function poplink(msg) { var content =\"<table border=0 cellpadding=0 cellspacing=0 bgcolor=#000000><tr><td><table width=100% border=0 cellpadding=2 cellspacing=1><tr><td bgcolor=#FFFFE1><font color=#000000 size=2 face='verdana'><center>\"+msg+\"</center></td></tr></table></td></tr></table>\"; if (domok) { document.getElementById(\"topdecklink\" ).innerHTML = content; if (msg != \"\" ) { skn.visibility = \"visible\"; } else { skn.visibility = \"hidden\"; } } } " );
pop.window.document.write("function killlink() { if (domok) { document.getElementById(\"topdecklink\" ).innerHTML = ''; skn.visibility = \"hidden\"; } } " );
pop.window.document.write("function get_mouse(e) { var x = (navigator.appName.substring(0,3) == \"Net\" ) ? e.pageX : event.x+document.body.scrollLeft; var y = (navigator.appName.substring(0,3) == \"Net\" ) ? e.pageY : event.y+document.body.scrollTop; if (navigator.appName.substring(0,3) == \"Net\" ) { var tWi = window.innerWidth; var tHe = window.innerHeight; if((x > (tWi-70)) && (tWi-70>=0)) skn.left = tWi-70; else skn.left = x; if((y > (tHe-50)) && ((tHe-50) > 0)) skn.top = tHe-50; else skn.top = y+20;} else { skn.left = x; skn.top = y+20; } } </script>" );
}
pop.window.document.write("<TABLE border=0, cellspacing=0, cellpadding=0, width=\"100%\", height=\"100%\"><TR><TD valign=center><CENTER>" );
pop.window.document.write("<img src=\""+file+"\"" );
if (comments_mode == 1)
{
pop.window.document.write(" alt=\""+comments+"\"" );
pop.window.document.write(" title=\""+comments+"\"" );
}
else if (comments_mode == 2)
pop.window.document.write(" onMouseOver=\"poplink('"+comments+"');\" onMouseOut=\"killlink();\"" );
if (!image_reduced || !adapt_image)
pop.window.document.write(" width="+image_width+" height="+image_height);
else
{
// find best dimension for image...
var ratioX;
var ratioY;
if (allow_full_size) ratioX = (popup_width - 16) / image_width;
else ratioX = popup_width / image_width;
if (allow_full_size) ratioY = (popup_height - additionnal_margin_for_comment-5) / image_height;
else ratioY = (popup_height - additionnal_margin_for_comment) / image_height;
if (ratioY < ratioX) ratioX = ratioY;
var temp_width = ratioX * image_width;
var temp_height = ratioX * image_height;
pop.window.document.write(" width="+temp_width+" height="+temp_height);
if (allow_full_size)
{
pop.window.document.write(" name=\"embedded_image\" OnClick=\"if(IsReduced == 1) { embedded_image.width="+image_width+"; embedded_image.height="+image_height+";IsReduced=0;}else{embedded_image.width="+temp_width+"; embedded_image.height="+temp_height+";IsReduced=1;}\">" );
pop.window.document.write("<script language=\"javascript\">var IsReduced=1;</script" );
}
}
pop.window.document.write(">" );
if (comments_mode == 3) pop.window.document.write("</td></tr><tr height=10 valign=\"bottom\"><td align=\"center\"><font face=\"arial\" size=2 color='"+textcolor+"'>"+comments+"</font></a><br>" );
if (IsFullScreen == 1) pop.window.document.write("</td></tr><tr height=10 valign=\"bottom\"><td align=\"center\"><a href=\"javascript:window.close()\"><font face=\"arial\" size=2 color='"+textcolor+"'>Fermer</font></a><br>" );
pop.window.document.write("</CENTER></TD></TR></TABLE></BODY></HTML>" );
}
-->
</script>
<style type="text/css">
<!--
a { cursor:pointer; cursor:hand; }
-->
</style>
<CENTER>
<a OnClick="Xander_Popup('../Multimedia/aviron/site/Cadet2005/vichy2005/Photo/P7011138.JPG',2048,1536,-1,-1,1,0,'#000000','#FFFFFF','',1)"><img src="../Multimedia/aviron/site/Cadet2005/vichy2005/Photo/mini/small_P7011138.JPG" width=205 height=154 border=0 alt="" title=""></a>

J'ai trouvé ce code pour afficher une image en lien vers l'image taille réelle
alors comment l'adapter dans ce script (image aleatoir) :

dans HEAD

Code :

</style>
</head>
<script type="text/javascript">
function rand_number(n)
{
var x;
x=Math.round(Math.random()*100);
x%=n;
return x;
}
function banner()
{
var img = new Array();
img[0]='<a href="lien_1.html"><img src="south park.JPG" border=0 width=150 height=80 alt="Votre commentaire 1"></a>';
img[1]='<a href="lien_2.html"><img src="small_P7011139.JPG" border=0 width=150 height=80 alt="Votre commentaire 2"></a>';
img[2]='<a href="lien_3.html"><img src="small_P7011145.JPG" border=0 width=150 height=80 alt="Votre commentaire 3"></a>';
var n=rand_number(3);
document.write(img[n]);
}
//-->
</script>

dans BODY

Code :

</script>
<body bgcolor="#FFFFFF" topmargin="0" marginheight="0">
<table id="Table_01" width="800" height="1063" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="8">
<img src="images/c-parti_01.gif" width="800" height="246" alt=""></td>
</tr>
<tr>
<td colspan="8">
<img src="images/c-parti_02.gif" width="800" height="42" alt=""></td>
</tr>
<tr>
<td colspan="4">
<img src="images/c-parti_03.gif" width="187" height="14" alt=""></td>
<td rowspan="3">
<img src="images/c-parti_04.gif" width="65" height="129" alt=""></td>
<td>
<img src="images/c-parti_05.gif" width="513" height="14" alt=""></td>
<td colspan="2" rowspan="3">
<img src="images/c-parti_06.gif" width="35" height="129" alt=""></td>
</tr>
<tr>
<td>
<img src="images/c-parti_07.gif" width="4" height="99" alt=""></td>
<td colspan="2" rowspan="3">
<img src="images/c-parti_08.gif" width="27" height="135" alt=""></td>
<td width="156" height="99" bgcolor="#55BE47"><script type="text/javascript">banner();</script>

Merci d'avance

xtof_83

Freeride Spirit

[:atog] [:atog] [:atog] [:alph-one]

Bon alors je vais être gentil...Met le contenu de tes <script> dans un fichier .js
(sans les balises <script> :sweat: )

que tu appeles ensuite dans le head <script src="fichier.js" type="text/JavaScript"></script>

pour ton css

tu fais un fichier.css

tu colles dedans...
et tu appels dnas le head

<link href="/fichier.css" rel="stylesheet" type="text/css" />

le reste est à foutre dnas le body...

Tiens des sites super, mais je pense que tu ten fou...

Pour toi:
http://www.csszengarden.com/
http://www.alsacreations.com
http://openweb.eu.org/

++

FORUM HardWare.fr

Programmation

HTML/CSS

Image aleatoire + lien automatique vers l'image taille réelle et .....

Sujets relatifs
Image Map + onmouseover avec 2 actions	transformation d'un lien inter-page en XSL
lien hypertexte front page 2003	export graphiques vers word VBA
Convertion ANSI vers UTF8	probleme affichage image
[GDI+] Image et Frames : comment ça marche ?	probleme lien audio
importer une bases .sql vers mysql sur easyphp	Faire un lien en php
Plus de sujets relatifs à : Image aleatoire + lien automatique vers l'image taille réelle et .....

Page générée en 0.108 secondes