Button Bearbeiten in einem Bild

Ich möchte eine Galerie für meine Website machen. Ich habe den Code entwickelt, um ein Bild hinzuzufügen, aber ich möchte Bildern wie Facebook eine Bearbeitungsschaltfläche hinzufügen.Button Bearbeiten in einem Bild

Ich möchte es so, wenn Sie die Maus auf dem Bild übergeben, können Sie die Schaltfläche zum Bearbeiten sehen.

Ich habe viel gesucht, aber ohne etwas hilfreiches.

Hier ist mein Code:

<?php 
 
    if(isset($_POST['upload_img'])){ 
 

 
    $file_name = $_FILES['images']['name']; 
 
    $file_type = $_FILES['images']['type']; 
 
    $file_size = $_FILES['images']['size']; 
 
    $file_tmp = $_FILES['images']['tmp_name']; 
 
    if($file_name){ 
 
     move_uploaded_file($file_tmp,"img/$file_name"); 
 
    } 
 
    } 
 

 
?> 
 
<html> 
 
<head> 
 
    <title>Test upload img</title> 
 
</head> 
 
<body> 
 
<form action="" method="post" enctype="multipart/form-data"> 
 
<label>Upload Image</label><br> 
 
<input type="file" name="images"><br><br> 
 
<input type="submit" value="upload img" name="upload_img"> 
 
</form> 
 

 
<?php 
 
$folder="img/"; 
 
if(is_dir($folder)){ 
 
if($handle = opendir($folder)){ 
 
while(($file=readdir($handle))!=false){ 
 
if($file==='.' || $file==='..') 
 
continue; 
 
echo'<img src="img/'.$file.'"width="150" height="150"> 
 
<form> 
 
<input type="file" value="Edit"> 
 
</form> 
 
'; 
 
} 
 
closedir($handle); 
 
} 
 
} 
 
?> 
 

 
</body> 
 
</html>

Quelle

2016-06-25 sayousaad

hoffen, dass diese Hilfe.

HTML:

<div class="image_container"> 
    <input type="file" class="edit_btn" value="Edit"> 
    <img src="img.jpg"> 
</div>

CSS:

.image_container{ position: relative; } 
.edit_btn{ postion: asolute; top: 10px; right: 10px; background-color: #000; color: #fff; padding: 8px 15px; border: 0; display: none; } 
.image_container:hover .edit_btn{ display: block; }

Quelle

2016-06-25 00:25:13

Button Bearbeiten in einem Bild

Antwort

Verwandte Themen