Skip to main content

PHP link image from a directory

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;
}

Comments

Popular posts from this blog

Should javascript be enabled or disabled?

Javascript Javascript is the most popular client-end scripting language used by every website.  Javascript provides a way to create custom tools for the websites which are used to improve the overall site quality and UI (User Interface). It's also popular as it allow the audio and video streaming too. Google used the javascript to load the web page contents dynamically i.e., instead of redirecting the user to a new page or refreshing the same page, the contents are updated on the required parts on the web page. This dynamic content loading approach is known as AJAX which has now become much more popular as almost every website is using this, at least, to validate the form. Javascript vs No-Javascript Some people often disable the javascript from their browser settings. If you are one of them and think that javascript is a security threat, then, you are completely wrong. Javascript is a way to improve the website quality according to the client's machine and navigato...

WP similar or related posts widget without using any plugin

Hi guys, Recently I was working on some WP website and my client told me that he required a widget for displaying related/similar posts on the single post page. But as his website was already using many plugins, even for some pretty small tasks like this one, I decided not to use another WP plugin (plugins are not good for your WP websites, we will discuss about that on some other post.) I am not explaining the code as it is pretty simple if you are familiar with WP classes. But please let me know if you have any questions related to the PHP code posted below in the comments section or even much better, on Gist. You can add the following code directly in your child theme's functions.php file or you can create a separate file and include this at the bottom of functions.php file. <?php class similar_posts_widget extends WP_Widget {     function __construct()     {         parent::__construct('similar_posts_...

Java Program to print first n Natural numbers in reverse order

import java.io.*; import java.util.*; public class NaturalRev extends Natural{     Scanner scan=new Scanner(System.in);     int n;     public void input()throws IOException{         System.out.println("Enter limit: ");         n=scan.nextInt();     }     public void compute(){         if(n>1)             System.out.println("First "+n+" natural numbers in reverse order are: ");         else             System.out.println("First "+n+" natural number in reverse order is: ");         for(int i=n; i>=1; i--)             System.out.println(i);     }   ...