Dynamic Slider Code - Hallo sahabat Tutorials, Pada Artikel yang anda baca kali ini dengan judul Dynamic Slider Code , kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.

Judul : Dynamic Slider Code
link : Dynamic Slider Code

Dynamic Slider Code

(1)write code for form.html file:

<html>
<body>
<form enctype="multipart/form-data" action="img_db.php" method="POST">
Image Title: <input type="text" name="img_title" /><br /><br />
Image Description: <input type="text" name="img_desc" /><br /><br />
Choose a file to upload: <input name="uploadedfile" type="file" /><br /><br />
<input name="submit" type="submit" value="submit" />
</form>
</body>
</html>

(2)write code for img_db.php file :

<?php
if(isset($_POST["submit"]))
{
$img_title=$_POST["img_title"];
$img_desc=$_POST["img_desc"];
}
$img_name=$_FILES["uploadedfile"]["name"];
if (($_FILES["uploadedfile"]["type"]=="image/gif"
|| $_FILES["uploadedfile"]["type"]=="image/jpeg"
|| $_FILES["uploadedfile"]["type"]=="image/pjpeg"
&& $_FILES["uploadedfile"]["size"]<20000))
{
if ($_FILES["uploadedfile"]["error"]>0)
{
echo "Return Code:".$_FILES["uploadedfile"]["error"]."<br />";
}
else
{
$i=1;
$success=false;
$new_img_name=$img_name;
while(!$success)
{
if (file_exists("uploads/".$new_img_name))
{
$i++;
$new_img_name="$i".$img_name;
}
else
{
$success=true;
}
}
move_uploaded_file($_FILES["uploadedfile"]["tmp_name"],"uploads/".$new_img_name);
echo "Stored in: "."uploads/".$new_img_name;
echo "<br />";
$con=mysql_connect("localhost","root","");
mysql_select_db("priyanka",$con);
$qry="INSERT INTO images(Image_Title,Image_Name,img_filename)
VALUES('$img_title','$img_desc','$new_img_name')";
if(!mysql_query($qry))
{
die("An error".mysql_error());
}
else
{
echo "1 row added";
}
}
}
else
{
echo "Invalid file";
}
?>

(3)now write code to display your images in slider :

<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
width: 70%;
margin: auto;
}
</style>
</head>
<body>
<div class="container">
<br>
<div id="myCarousel" class="carousel slide" data-ride="carousel">



<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="img_chania.jpg" alt="Chania" width="460" height="345">
</div>

<?php

$con=mysql_connect("localhost","root","");
mysql_select_db("priyanka",$con);
$qry="SELECT * FROM images";
$result=mysql_query($qry);
//$row=mysql_fetch_array($result);

while($row=mysql_fetch_array($result))
{
echo ' <div class="item">';
echo "
<img
src=uploads/".$row["img_filename"]." height=\"460\"
width=\"345\"/>";
echo '</div>';

}

?>
</div>


<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>

</body>
</html>

Output will be :

Demikianlah Artikel Dynamic Slider Code

Sekianlah artikel Dynamic Slider Code kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya.

Anda sekarang membaca artikel Dynamic Slider Code dengan alamat link https://othereffect.blogspot.com/2016/10/dynamic-slider-code.html

Dynamic Slider Code

Dynamic Slider Code

Demikianlah Artikel Dynamic Slider Code

0 Response to "Dynamic Slider Code "