8791 sujets

Développement web côté serveur, CMS

Ajouter un Roll-over dans ce bout de code

Bonjour,

J'ai mis en place une galerie sur l'un de mes sites, mais dans un soucis d'esthétique, j'aurai voulu que lorsque l'on passe le curseur de la souris sur l'une des vignette, celle-ci se mette en surbrillance, pour se faire, j'ai prévu une image en png .

Voici le code la page en question :

<?php
if (!include("settings.php")) {
	include("settings.php");
}
if (!include("includes.php")) {
	include("includes.php");
}

if (!$css_js_added) {
?>
<link rel="stylesheet" href="<?=site_address?><?=javascript_folder?>prettyPhoto/css/prettyPhoto.css" type="text/css" media="screen" charset="utf-8" />
<script src="<?=site_address?><?=javascript_folder?>jquery-1.3.2.js" type="text/javascript" charset="utf-8"></script>
<script src="<?=site_address?><?=javascript_folder?>prettyPhoto/js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>


<script type="text/javascript">
$(document).ready(function(){
	$("a[rel^='prettyPhoto']").prettyPhoto({
		animationSpeed: '<?=animation_speed?>', /* fast/slow/normal */
		padding: <?=padding?>, /* padding for each side of the picture */
		opacity: <?=opacity?>, /* Value betwee 0 and 1 */
		showTitle: <?=show_gallery_title?>, /* true/false */
		allowresize: <?=allow_resize?>, /* true/false */
		counter_separator_label: '<?=counter_separator_label?>', /* The separator for the gallery counter 1 "of" 2 */
		theme: '<?=theme?>', /* light_rounded / dark_rounded / light_square / dark_square */
		modal: <?=modal?>, /* If set to true, only the close button will close the window */
		changepicturecallback: function(){}, /* Called everytime an item is shown/changed */
		callback: function(){} /* Called when prettyPhoto is closed */
	});
});

</script>
<?php
$css_js_added = true;
}
$files = mysql_query("select I.src,I.id,I.alt,G.name,G.description from `images` I, `galleries` G where I.gallery = G.id and I.gallery = '".$gallery."' group by I.id order by I.order asc");
$say = mysql_num_rows($files);

$i=0;
while ($row = mysql_fetch_array($files)) {
	$fl = $row["src"];
	$title = stripslashes($row["name"]);
	$alt = str_replace('"', "&apos;", stripslashes($row["alt"]));
	if (show_gallery_description == "true") { $alt .= " - ".$row["description"]; }
	$i++;
?>
<div style="float:left; padding-right:6px; padding-bottom:6px;">
<a href='<?=site_address.uploaded_images_folder?><?=$row["name"]?>/<?=$fl?>' rel='prettyPhoto[<?=$gallery?>]' alt="<?=$alt?>"><img src='<?=site_address.thumbnail_images_folder?><?=$row["name"]?>/<?=$fl?>' border='0' width='<?=thumbnail_size?>' style='border:1px solid #CCCCCC; padding:5px; background-color:#FFFFFF;' alt='<?=$title?>' /></a>
</div>
<? } ?>


La galerie, quant à elle, se situe là : http://www.gwilhoo.com/photos.php

Merci d'avance pour votre aide.
Modérateur
Bonjour

Ton code est carrément illisible, c'est une des pire bouillie php/html/js/css que j'aie vu. Essaie d'être mieux organisé, et de bien séparer les choses.


if (!include("settings.php")) {
	include("settings.php");
}

J'inclus settings.php, si il me retourne false, je le réinclu une seconde fois, histoire d'être sûr.
=> peut être que ce que tu souhaites faire est include_once

Après si tu as une question, on peut peut-être y répondre, mais je n'en ai pas vu Smiley langue
Je sais pas comment le nettoyer étant donné qu'il s'agit d'un script que j'ai téléchargé, je suis pas très doué en programmation. Tout ce que je sais c'est que la partie du code qui m'intéresse se situe à la fin :


<div style="float:left; padding-right:6px; padding-bottom:6px;">
<a href='<?=site_address.uploaded_images_folder?><?=$row["name"]?>/<?=$fl?>' rel='prettyPhoto[<?=$gallery?>]' alt="<?=$alt?>"><img src='<?=site_address.thumbnail_images_folder?><?=$row["name"]?>/<?=$fl?>' border='0' width='<?=thumbnail_size?>' style='border:1px solid #CCCCCC; padding:5px; background-color:#FFFFFF;' alt='<?=$title?>' /></a>
</div>


C'est cette portion de code qui gère l'affichage d'un entourage blanc autours de mes vignettes et j'ai pensé que ça serait ici qu'il faudrait modifier le code pour qu'il y ai comme un effet de roll-over sur les vignette avec une image en png et aussi un changement ce couleur de la bordure.
Sujet clos
Aller à