Eléphanteau du PHP |
12 Messages
20 janv. 2014, 11:10
Merci à ceux qui ont participé, je vous mets le résultat final, il me manque juste un détail qui ne saurait tarder.
Tous les fichiers sont le même dossier.
index.php
<?php include "header.php"; ?>
<html>
<head>
<!-- Add jQuery library -->
<!-- Add jQuery library -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<!-- Add mousewheel plugin (this is optional) -->
<script type="text/javascript" src="/fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>
<!-- Add fancyBox -->
<link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js?v=2.1.5"></script>
<!-- Optionally add helpers - button, thumbnail and/or media -->
<link rel="stylesheet" href="/fancybox/source/helpers/jquery.fancybox-buttons.css?v=1.0.5" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-buttons.js?v=1.0.5"></script>
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-media.js?v=1.0.6"></script>
<link rel="stylesheet" href="/fancybox/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"></script>
</head>
<style>
*{
margin: 0;
}
.croix{
z-index: 999;
margin: 0 0 0 -20px;
float: left;
visibility: hidden;
}
a{
text-decoration: none;
color: white;
}
body{
background: #555;
}
#div{
margin: 0 auto;
background: #333;
width: 1200px;
height: auto;
}
ul .images{
z-index: 1;
width: auto;
float: left;
display: block;
list-style-type: none;
opacity: 0.5;
padding: 5px;
margin: 0 auto;
border: solid #555 2px;
margin: 15px 0 0 10px;
-webkit-transition-duration: 0.5s;
}
ul .images:hover{
-webkit-transform:scale(1);
-webkit-box-shadow: 0px 0px 30px #f9f9f9;
-webkit-border-radius: 10px;
border: solid #fff 2px;
opacity: 1;
}
ul .images:hover .croix{
visibility: visible;
}
</style>
<body>
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox({
openEffect : 'none',
closeEffect : 'none'
});
});
</script>
<?php
//Nom du dossier à scanner
$dossier = '.';
//scandir — Liste les fichiers et dossiers dans un dossier
$tableau = scandir($dossier);
$tableau = array_slice($tableau, 2, -4);
//Tri croissant
sort($tableau);
//On boucle
foreach($tableau as $valeur){
if ($valeur != "." AND $valeur != ".." AND (stristr($valeur,'.gif') OR stristr($valeur,'.jpg') OR stristr($valeur,'.png') OR stristr($valeur,'.bmp')))
{
echo '<ul><a class="fancybox" rel="gallery1" href="'.$valeur.'" title="'.$valeur.'"><img class="images" src="'.$valeur.'" height=170px></a> <a href="delete_file.php?nom='.$valeur.'"><img class="croix" src="../img/bouton_supprimer.gif" title="Supprimer"/></a></ul>';
}else{
echo '<ul><a class="fancybox" rel="gallery1" href="'.$valeur.'" title="'.$valeur.'"><img class="images" src="../img/txt.jpg" height=50px></a></ul>';
}
}
?>
</body>
</html>
Supprimer images:
delete_file.php
<?php
$adresse = "";//Adresse du dossier.
if(isset($_GET['nom']))//Si la variable $_GET['nom'] existe...
{
//if ($Fichier != "." && $Fichier != "..") //Filtre anti-points
{
$nom=''.$adresse.$_GET['nom'].''; //Formatage du nom précédé de l'adresse du dossier dans lequel il se trouve.
unlink($nom); //Suppression du fichier
echo 'Le fichier "'.$_GET['nom'].'" a été effacé !<br>'; //Message de confirmation de suppression.
}
}
?>
<?php
echo '<script language="Javascript">
document.location.replace("index.php");
</script>';
?>
Voilà pour le plus direct, mon seul problème, c'est l'apparence des croix de suppression qui n'apparaissent pas lorsque je passe la souris sur l'image.
Si je met la class .croix en visibility, les croix apparaissent toujours, c'est très peu esthétique.