The following code is to link images from your php directory. "photo.php" acts in two ways. The "src" attribute should be like "src=photo.php?view=1&default=0&id=1". When "view=0" is used it is to tell the script that the photo is to be used within a page. When "view=1" is used it is to tell the script that the page, "photo.php", is to be loaded and other options are shown to the user. Here, "id" specifies the image that is to be shown on the page. And "default=1" specifies that the image isn't user uploaded but images to be used in the sites.
The use of above mentioned things can be seen in the same following code:
<?php
session_start();
$id = $_GET["id"];
$default = "";
if (isset($_GET["default"]))
$default = $_GET["default"];
$photo_path = "/php/account/";
$view = NULL;
if (isset($_GET["view"]))
$view = $_GET["view"];
if ($default == 1)
$photo_path.="site";
else
$photo_path.="users/photos";
//echo "<img src=\"$photo_path/$id.jpg\"/>";
//echo "<body style=\"background-image: url($photo_path/$id.jpg);\">";
if (isset($_COOKIE[md5("session")]) || isset($_COOKIE[md5("signup")])) {
$name = $photo_path . "/" . $id;
if (isset($_GET["view"]) && $view == 1) {
$profile_photo = $_SESSION['profile_photo'];
$nm = $_SESSION['name'];
echo'<!DOCTYPE html><html><head><link href="http://localhost/php/account/photo.css" rel="stylesheet" type="text/css"/><link href="http://localhost/php/account/head.css" rel="stylesheet" type="text/css"/><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>' . $nm . ' | Photo</title><script src="http://localhost/php/account/jquery.js"></script></head><body><center><span><img id="show" src="image.php?type=show"/></span><table style="margin-top: 25px;"><tbody class="tbody"><tr><th rowspan="3"><a class="link_img" href="http://localhost/php/account/photo.php?default=0&view=1&id=' . $id . '"><img src="' . $profile_photo . '" style="width: 160px; height: 160px;"/></a></th><th>Status</th><th>Image</th><th>File</th></tr><tr><th colspan="3" valign="bottom"><textarea rows="5" cols="70" id="post" style="overflow: hidden;" autofocus placeholder="Share Your Thoughts!"></textarea></th><th valign="bottom"><button id="postButton" onclick="post();">POST</button></th></tr><tr><th>Privacy</th><th>Post Later</th><th>Send As Message</th></tr></tbody></table><span><img id="hide" src="image.php?type=hide"/></span></div><script>$(".tbody").hide();$("#hide").hide();$("body").ready(function(){if($("#img").width()>600)$("#img").width("700px");if($("#img").height()>500)$("#img").height("500px");});$("#show").click(function(){$(".tbody").fadeIn("slow");$("#hide").fadeIn("slow");$("#show").fadeOut("fast");$("#topTabs").height("220px");$("#img").css("margin-top", "232px");});$("#hide").click(function(){$(".tbody").fadeOut("slow");$("#show").fadeIn("slow");$("#hide").fadeOut("slow");$("textarea").val("");$("#topTabs").height("35px");$("#img").css("margin-top", "3.5em");});</script>';
echo'<div id="main"><div><img id="img" src="http://localhost/php/account/photo.php?default=' . $default . '&id=' . $id . '" class="file_view"/></div><div id="caption"></div><div><table id="comments"><thead id="likes"></thead></table></div></div>';
echo '</body></html>';
} else {
imagejpeg(imagecreatefromjpeg($name));
}
} else {
die(header("location:http://localhost/php/account/login.php"));
}
?>
"image.php" contains the following code:
<?php
if ($_GET["type"] == "show")
$image = "/php/account/show.png";
else if ($_GET["type"] == "hide")
$image = "/php/account/hide.png";
imagepng(imagecreatefrompng($image));
?>
"show.png" & "hide.png"
The are the images used as buttons
CSS:
body{
background-color: whitesmoke;
color: white;
line-height: 1.5em;
margin: 0;
font-size: small;
}
textarea{
resize: none;
position: static;
overflow: hidden;
background-color: #C4CCDF;
color: #294a8f;
border-color: #C4CCDF;
font-family: Tahoma;
}
#show:hover, #hide:hover{
opacity: 0.3;
border: 2px solid gainsboro;
}
#show, #hide{
border-radius: 40px/24px;
border: none;
}
#postButton{
border-radius: 40px/24px;
}
#topTabs{
height: 35px;
}
#topTabs{
overflow: hidden;
position: fixed;
z-index: 999;
width: 100%;
}
#topTabs span{
height: 19.99px;
}
#topTabs,#home,#profile,#messages,#notifications,#friends,#onlineFriends,#search,#accountSettings,#privacySettings,#logout,#helpCenter,#switchID{
background-color: #009CEB;
color: white;
font-family: Tahoma;
border: solid thick;
border-color: #009CEB;
appearance: normal;
font-weight: bold;
text-decoration: none;
}
#main div img{
margin-top: 3.5em;
margin-left: 0.3em;
border: solid 10px rgb(153, 217, 234);
border-style: dashed;
}
input[type="submit"]{
border-color: #009CE8;
background-color: #009CE8;
appearance: push-button;
color: white;
font-size: xx-large;
height: 55px;
width: 350px;
font-weight: bolder;
}
#pop-up div{
background-color: #00A2E8;
font-size: small;
margin: 0;
color: white;
cursor: pointer;
z-index: 999;
}
#close{
border: #009CEB;
width: 15px;
height: 15px;
font-size: xx-small;
}
a{
color: white;
}
#error{
background-color: #009CE8;
color: white;
}
img{
border: solid medium #294a8f;
}
.link_img:hover{
z-index: 0;
opacity: 0.8;
}
The use of above mentioned things can be seen in the same following code:
<?php
session_start();
$id = $_GET["id"];
$default = "";
if (isset($_GET["default"]))
$default = $_GET["default"];
$photo_path = "/php/account/";
$view = NULL;
if (isset($_GET["view"]))
$view = $_GET["view"];
if ($default == 1)
$photo_path.="site";
else
$photo_path.="users/photos";
//echo "<img src=\"$photo_path/$id.jpg\"/>";
//echo "<body style=\"background-image: url($photo_path/$id.jpg);\">";
if (isset($_COOKIE[md5("session")]) || isset($_COOKIE[md5("signup")])) {
$name = $photo_path . "/" . $id;
if (isset($_GET["view"]) && $view == 1) {
$profile_photo = $_SESSION['profile_photo'];
$nm = $_SESSION['name'];
echo'<!DOCTYPE html><html><head><link href="http://localhost/php/account/photo.css" rel="stylesheet" type="text/css"/><link href="http://localhost/php/account/head.css" rel="stylesheet" type="text/css"/><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>' . $nm . ' | Photo</title><script src="http://localhost/php/account/jquery.js"></script></head><body><center><span><img id="show" src="image.php?type=show"/></span><table style="margin-top: 25px;"><tbody class="tbody"><tr><th rowspan="3"><a class="link_img" href="http://localhost/php/account/photo.php?default=0&view=1&id=' . $id . '"><img src="' . $profile_photo . '" style="width: 160px; height: 160px;"/></a></th><th>Status</th><th>Image</th><th>File</th></tr><tr><th colspan="3" valign="bottom"><textarea rows="5" cols="70" id="post" style="overflow: hidden;" autofocus placeholder="Share Your Thoughts!"></textarea></th><th valign="bottom"><button id="postButton" onclick="post();">POST</button></th></tr><tr><th>Privacy</th><th>Post Later</th><th>Send As Message</th></tr></tbody></table><span><img id="hide" src="image.php?type=hide"/></span></div><script>$(".tbody").hide();$("#hide").hide();$("body").ready(function(){if($("#img").width()>600)$("#img").width("700px");if($("#img").height()>500)$("#img").height("500px");});$("#show").click(function(){$(".tbody").fadeIn("slow");$("#hide").fadeIn("slow");$("#show").fadeOut("fast");$("#topTabs").height("220px");$("#img").css("margin-top", "232px");});$("#hide").click(function(){$(".tbody").fadeOut("slow");$("#show").fadeIn("slow");$("#hide").fadeOut("slow");$("textarea").val("");$("#topTabs").height("35px");$("#img").css("margin-top", "3.5em");});</script>';
echo'<div id="main"><div><img id="img" src="http://localhost/php/account/photo.php?default=' . $default . '&id=' . $id . '" class="file_view"/></div><div id="caption"></div><div><table id="comments"><thead id="likes"></thead></table></div></div>';
echo '</body></html>';
} else {
imagejpeg(imagecreatefromjpeg($name));
}
} else {
die(header("location:http://localhost/php/account/login.php"));
}
?>
"image.php" contains the following code:
<?php
if ($_GET["type"] == "show")
$image = "/php/account/show.png";
else if ($_GET["type"] == "hide")
$image = "/php/account/hide.png";
imagepng(imagecreatefrompng($image));
?>
"show.png" & "hide.png"
The are the images used as buttons
CSS:
body{
background-color: whitesmoke;
color: white;
line-height: 1.5em;
margin: 0;
font-size: small;
}
textarea{
resize: none;
position: static;
overflow: hidden;
background-color: #C4CCDF;
color: #294a8f;
border-color: #C4CCDF;
font-family: Tahoma;
}
#show:hover, #hide:hover{
opacity: 0.3;
border: 2px solid gainsboro;
}
#show, #hide{
border-radius: 40px/24px;
border: none;
}
#postButton{
border-radius: 40px/24px;
}
#topTabs{
height: 35px;
}
#topTabs{
overflow: hidden;
position: fixed;
z-index: 999;
width: 100%;
}
#topTabs span{
height: 19.99px;
}
#topTabs,#home,#profile,#messages,#notifications,#friends,#onlineFriends,#search,#accountSettings,#privacySettings,#logout,#helpCenter,#switchID{
background-color: #009CEB;
color: white;
font-family: Tahoma;
border: solid thick;
border-color: #009CEB;
appearance: normal;
font-weight: bold;
text-decoration: none;
}
#main div img{
margin-top: 3.5em;
margin-left: 0.3em;
border: solid 10px rgb(153, 217, 234);
border-style: dashed;
}
input[type="submit"]{
border-color: #009CE8;
background-color: #009CE8;
appearance: push-button;
color: white;
font-size: xx-large;
height: 55px;
width: 350px;
font-weight: bolder;
}
#pop-up div{
background-color: #00A2E8;
font-size: small;
margin: 0;
color: white;
cursor: pointer;
z-index: 999;
}
#close{
border: #009CEB;
width: 15px;
height: 15px;
font-size: xx-small;
}
a{
color: white;
}
#error{
background-color: #009CE8;
color: white;
}
img{
border: solid medium #294a8f;
}
.link_img:hover{
z-index: 0;
opacity: 0.8;
}
Comments