PHP - Background Image

This topic has been moved to CSS Help.

http://www.phpfreaks.com/forums/index.php?topic=355565.0

This topic has been moved to JavaScript Help.

http://www.phpfreaks.com/forums/index.php?topic=331191.0

I am using the following css  

.content {
    min-height: 850px;
    color: #CCC;
    padding-right: 320px;
    background-image:url(../images/wheelie.png);
    background-repeat: no-repeat;
    background-position: right bottom;
}

however the background image only shows in the desktop version of safari, I have checked firefox and chrome and mobile safari.   I can't see why.

Hello   I am working on a site and the theme is a responsive theme but the header background is not resizing on mobile and tablets below is a link to the site

http://unitednews.sr/category/news/

each category / page has a unique header , this is what I have in css for category news

body.category-news  #header-wrap { background: url( http://unitednews.sr/wp-content/uploads/2014/10/Header_UnitedNews.jpg);
background-repeat:no-repeat;
}

Adding background size: cover does not work any idea ?
Edited by crawling, 13 November 2014 - 11:47 AM.

I am trying to add a background image via a custom style, but it breaks my site. I am a php novice, can someone point out my error please?

The echo is being used other places on this page, so I know this code is ok:

<?php echo $event->data->thumbnails['medium']; ?>

but I am missing something here, this keeps breaking the page:

<?php
        echo '<article data-style="'.$label_style.'" style="background-image:url(\<?php echo $event->data->thumbnails['medium']; ?>\")" class="mec-event-article mec-clear '.$this->get_event_classes($event).'"' . $colorful_bg_color . '>';
?>

Thanks for any help, as I learn!

I am trying to copy an image into another image.

Code: [Select]
$im = imagecreatefrompng("/oldimg.png"); //this is a semi-transparent image where I want the new image to be copied

imagealphablending($im, 1); //this seems to remove the black background

header('Content-type: image/png'); //outputs old image with a transparent background (YAY!)
imagepng($im);

imagecopy($im, $newimage, 32, 0, 0, 0, 32, 32); //I want to replace a part of the old image with a new semi-transparent image

header('Content-type: image/png'); //outputs image with a black background (noooooooooo!)
imagepng($im);

Can anyone help me?

I want to place Custom background image for embedded media player

Can anyone help me?

This topic has been moved to JavaScript Help.

http://www.phpfreaks.com/forums/index.php?topic=347058.0

I want to get image background removal with core php like(remove.bg website without using any API)

 

i want to do it with code any guidance how can i do this with programmatically in php.

How can i edit just one image at on time with a multiple image upload form? I have the images being stored in a folder and the path being stored in MySQL. I also have the files being uploaded with a unique id. My issue is that I want to be able to pass the values of what is already in $name2 $name3 $name4 if I only want to edit $name1. I don't want to have to manually update the 4 images. Here is the PHP:
Code: [Select]
<?php

require_once('storescripts/connect.php');
mysql_select_db($database_phpimage,$phpimage);
$uploadDir = 'upload/';
if(isset($_POST['upload']))
{


foreach ($_FILES as $file)
{

    $fileName = $file['name'];
    $tmpName = $file['tmp_name'];
    $fileSize = $file['size'];
    $fileType = $file['type'];

    if ($fileName != ""){
        $filePath = $uploadDir;
        $fileName = str_replace(" ", "_", $fileName);

        //Split the name into the base name and extension
        $pathInfo = pathinfo($fileName);
        $fileName_base = $pathInfo['fileName'];
        $fileName_ext = $pathInfo['extension'];

        //now we re-assemble the file name, sticking the output of uniqid into it
        //and keep doing this in a loop until we generate a name that 
        //does not already exist (most likely we will get that first try)
        do {
           $fileName = $fileName_base . uniqid() . '.' . $fileName_ext;
        } while (file_exists($filePath.$fileName));

$file_names [] = $fileName;

        $result = move_uploaded_file($tmpName, $filePath.$fileName);
    }


if(!get_magic_quotes_gpc())
{
$fileName = addslashes($fileName);
$filePath = addslashes($filePath);
}
$fileinsert[] = $filePath;
}
}

$mid   = mysql_real_escape_string(trim($_POST['mid']));
$cat   = mysql_real_escape_string(trim($_POST['cat']));
$item  = mysql_real_escape_string(trim($_POST['item']));
$price = mysql_real_escape_string(trim($_POST['price']));
$about = mysql_real_escape_string(trim($_POST['about']));

$fields = array();
$values = array();
$updateVals = array();
for($i = 0; $i < 4; $i++)
{
    $values[$i] = isset($file_names[$i]) ? mysql_real_escape_string($file_names[$i]) : '';

    if($values[$i] != '') {
        $updateVals[] = 'name' . ($i + 1) . " = '{$values[$i]}'"; 
    }
}
$updateNames = '';
if(count($updateVals))
{
    $updateNames = ", " . implode(', ', $updateVals);
}

$update = "INSERT INTO image
               (mid, cid, item, price, about, name1, name2, name3, name4)
           VALUES
               ('$mid', '$cat', '$item', '$price', '$about', '$values[0]', '$values[1]', '$values[2]', '$values[3]')
           ON DUPLICATE KEY UPDATE
                cid = '$cat', item = '$item', price = '$price', about = '$about' $updateNames";
$result = mysql_query($update) or die (mysql_error());

Hi, I've read a lot of places that it's not recommended to store binary files in my db.
So instead I'm supposed to upload the image to a directory, and store the link to that directory in database.

First, how would I make a form that uploads the picture to the directory (And what kinda directories are we talking?).

Secondly, how would I retrieve that link? And I guess I should rename the picture..

I'd appreciate any help, or a good tutorial (Haven't found any myself).

After image is drop into container , I want to move copy of the original image to be move when original image dragend within container. I tried but it display copy image each time when original image dragend. can anyone help me?

 <!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Prototype</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
    <script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v4.7.2.min.js"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.min.js"></script>
<style>
    body{padding:20px;}
    #container{
      border:solid 1px #ccc;
      margin-top: 10px;
      width:350px;
      height:350px;
    }
    #toolbar{
      width:350px;
      height:35px;
      border:solid 1px blue;
    }
</style>        
<script>
$(function(){
 
    var $house=$("#house");
    $house.hide();
 
    var $stageContainer=$("#container");
    var stageOffset=$stageContainer.offset();
    var offsetX=stageOffset.left;
    var offsetY=stageOffset.top;
 
    var stage = new Kinetic.Stage({
        container: 'container',
        width: 350,
        height: 350
    });
    var layer = new Kinetic.Layer();
    stage.add(layer);
 
    var image1=new Image();
    image1.onload=function(){
        $house.show();
    }
    image1.src="http://vignette1.wikia.nocookie.net/angrybirds/images/b/b6/Small.png/revision/latest?cb=20120501022157";
 
    $house.draggable({
        helper:'clone',
    });
 
    $house.data("url","house.png"); // key-value pair
    $house.data("width","32"); // key-value pair
    $house.data("height","33"); // key-value pair
    $house.data("image",image1); // key-value pair

    $stageContainer.droppable({
        drop:dragDrop,
    });
    function dragDrop(e,ui){
 
        var x=parseInt(ui.offset.left-offsetX);
        var y=parseInt(ui.offset.top-offsetY);
 
        var element=ui.draggable;
        var data=element.data("url");
        var theImage=element.data("image");
 
        var image = new Kinetic.Image({
            name:data,
            x:x,
            y:y,
            image:theImage,
            draggable: true,
        
        dragBoundFunc: function(pos) {
            return {
              x: pos.x,
              y: this.getAbsolutePosition().y
            }
        }        
        
	   });
			image.on("dragend", function(e) {
			   var points = image.getPosition();
			   var image1 = new Kinetic.Image({
					name: data,
					id: "imageantry",
					x: points.x+65,
					y: points.y,
					image: theImage,
					draggable: false
				});
					layer.add(image1);
					layer.draw();
			});
		image.on('dblclick', function() {
			image.remove();
			layer.draw();
		});
        layer.add(image);
        layer.draw();
    }
 
}); // end $(function(){});

</script>       
</head>
<body>
    <div id="toolbar">
        <img id="house" width=32 height=32 src="http://vignette1.wikia.nocookie.net/angrybirds/images/b/b6/Small.png/revision/latest?cb=20120501022157"><br>
    </div>
    <div id="container"></div>
</body>
</html>

Edited by Biruntha, 08 January 2015 - 10:14 AM.

The script for creating a new file name for the image:

        $validextensions = array("jpeg", "jpg", "png");  //Extensions which are allowed
        $ext = explode('.', basename($_FILES['file']['name'][$i]));//explode file name from dot(.) 
        $file_extension = end($ext); //store extensions in the variable

        $new_image_name = md5(uniqid()) . "." . $ext[count($ext) - 1];
		$target_path = $target_path . $new_image_name;//set the target path with a new name of image

The script creates a new file like:

f6c9b8d9db05366c3504210cded9ddb2.jpg

and moves the file to the "uploads" folder. And then the script also creates a thumbnail with the same file name and moves the file to the "thumbs" folder.   The issue I am having is that the same ID code could happen again for a different image in the database, thus I would be calling a different original sized image than the thumbnail image.   My question is: How to avoid this issue of the same ID code has happened again for a different file. What is the proper way to reference the anchor tag of the thumbnail image to its actual original sized image?   With the script I have the thumbnail image would be coming from the "thumbs" folder and the anchor tag would get referenced to the "uploads" folder to get the original sized image.
Edited by glassfish, 12 October 2014 - 05:51 AM.

Hello,
I've had success creating a cool vanity QR code with rounded edges for my organization by generating a standard QR code, then applying a noise -> median effect in Photoshop to get the edges rounded among some other effects.



Photoshop is great, but I want to automate this. I found a great PHP library to generate QR codes. The part I don't get is the rounding of the hard edges.

I've seen other sites do it like this one.

So far google searches are yielding rounded corner tutorials. Any thoughts on how to do this with GD or ImageMagic?

Best regards,

Chris

Can I get some help or a point in the right direction. I am trying to create a form that allows me to add, edit and delete records from a database. I can add, edit and delete if I dont include the image upload code. If I include the upload code I cant edit records without having to upload the the same image to make the record save to the database. So I can tell I have got the code processing in the wrong way, thing is I cant seem to see or grasp the flow of this, to make the corrections I need it work. Any help would be great!   Here is the form add.php code

<?php require_once ("dbconnection.php"); 
	$id="";
	$venue_name="";
	$address="";
	$city="";
	$post_code="";			
	$country_code="";
	$url="";
	$email="";
	$description="";
	$img_url="";
	$tags="";
	
	if(isset($_GET['id'])){
		$id = $_GET['id'];
		$sqlLoader="Select from venue where id=?";
		$resLoader=$db->prepare($sqlLoader);
		$resLoader->execute(array($id));		
	} 
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Add Venue Page</title>
<link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
	
</head>
<body>
<div class="container">
<?php
	$sqladd="Select * from venue where id=?";
	$resadd=$db->prepare($sqladd);
	$resadd->execute(array($id));
		while($rowadd = $resadd->fetch(PDO::FETCH_ASSOC)){
		$v_id=$rowadd['id'];
		$venue_name=$rowadd['venue_name'];
		$address=$rowadd['address'];	
		$city=$rowadd['city'];
		$post_code=$rowadd['post_code'];
		$country_code=$rowadd['country_code'];
		$url=$rowadd['url'];
		$email=$rowadd['email'];
		$description=$rowadd['description'];
		$img_url=$rowadd['img_url'];
		$tags=$rowadd['tags'];
	}
?>
   <h1 class="edit-venue-title">Add Venue:</h1>
   <form role="form" enctype="multipart/form-data" method="post" name="formVenue" action="save.php">
    <input type="hidden" name="id" value="<?php echo $id; ?>"/>

	<div class="form-group">
		 	<input class="form-control" type="hidden" name="id" value="<?php echo $id; ?>"/>
		 	<p><strong>ID:</strong> <?php echo $id; ?></p>
		 	<strong>Venue Name: *</strong> 
		 	<input class="form-control" type="text" name="venue_name" value="<?php echo $venue_name; ?>"/><br/>
		 	<br/>
		 	<strong>Address: *</strong>
		 	<input class="form-control" type="text" name="address" value="<?php echo $address; ?>"/><br/>
		 	<br/>
		 	<strong>City: *</strong>
		 	<input class="form-control" type="text" name="city" value="<?php echo $city; ?>"/><br/>
		 	<br/>
		 	<strong>Post Code: *</strong>
		 	<input class="form-control" type="text" name="post_code" value="<?php echo $post_code; ?>"/><br/>
		 	<br/>
		 	<strong>Country Code: *</strong>
		 	<input class="form-control" type="text" name="country_code" value="<?php echo $country_code; ?>"/><br/>
		 	<br/>
		 	<strong>URL: *</strong>
		 	<input class="form-control" type="text" name="url" value="<?php echo $url; ?>"/><br/>
		 	<br/>
		 	<strong>Email: *</strong>
		 	<input class="form-control" type="email" name="email" value="<?php echo $email; ?>"/><br/>
		 	<br/>
		 	<strong>Description: *</strong>
		 	<textarea  class="form-control"  type="text" name="description" rows ="7" value=""><?php echo $description; ?></textarea><br/>
		 	<br/>
		 	<strong>Image Upload: *</strong>
		 	<input class="form-control" type="file" name="image" value="<?php echo $img_url; ?>"/>
		 	      		<small>File sizes 300kb's and below 500px height and width.<br/><strong>Image is required or data will not save.</strong></small>	 	<br/><br/>
		 	<strong>Tags: *</strong>
		 	<input class="form-control" type="text" name="tags" value="<?php echo $tags; ?>"/><small>comma seperated vales only, e.g. soul,hip-hop,reggae</small><br/>
		 	<br/>
 			<p>* Required</p>
 			<br/>
 			<input  class="btn btn-primary" type="submit" name="submit" value="Save">

	 </div>

    </form>
</div>
</body>
</html>

Here is the save.php code

<?php	
error_reporting(E_ALL);
  ini_set("display_errors", 1);
	include ("dbconnection.php");
	$venue_name=$_POST['venue_name'];
	$address=$_POST['address'];
	$city=$_POST['city'];
	$post_code=$_POST['post_code'];
	$country_code=$_POST['country_code'];
	$url=$_POST['url'];
	$email=$_POST['email'];
	$description=$_POST['description'];
	$tags=$_POST['tags'];
	$id=$_POST['id'];

	if(is_uploaded_file($_FILES['image']['tmp_name'])){ 
    $folder = "images/hs-venues/"; 
    $file = basename( $_FILES['image']['name']); 
    $full_path = $folder.$file; 
    if(move_uploaded_file($_FILES['image']['tmp_name'], $full_path)) { 
    //echo "succesful upload, we have an image!";
    var_dump($_POST);



		if($id==null){

				$sql="INSERT INTO venue(venue_name,address,city,post_code,country_code,url,email,description,img_url,tags)values(:venue_name,:address,:city,:post_code,:country_code,:url,:email,:description,:img_url,:tags)";
				$qry=$db->prepare($sql);
				$qry->execute(array(':venue_name'=>$venue_name,':address'=>$address,':city'=>$city,':post_code'=>$post_code,':country_code'=>$country_code,':url'=>$url,':email'=>$email,':description'=>$description,':img_url'=>$full_path,':tags'=>$tags));
		}else{
				$sql="UPDATE venue SET venue_name=?, address=?, city=?, post_code=?, country_code=?, url=?, email=?, description=?, img_url=?, tags=? where id=?";
				$qry=$db->prepare($sql);
				$qry->execute(array($venue_name, $address, $city, $post_code, $country_code, $url, $email, $description, $full_path, $tags, $id));
				}

		if($success){
			var_dump($_POST);
            echo "<script language='javascript' type='text/javascript'>alert('Successfully Saved!')</script>";
            echo "<script language='javascript' type='text/javascript'>window.open('index.php','_self')</script>";
        	}
        
        

        else{
        	var_dump($_POST);
            echo "<script language='javascript' type='text/javascript'>alert('Successfully Saved!')</script>";
            echo "<script language='javascript' type='text/javascript'>window.open('index.php','_self')</script>";
    		}
    	
    	} //if uploaded
    	
    	else{ 
    		var_dump($_POST);
            echo "<script language='javascript' type='text/javascript'>alert('Upload Recieved but Processed Failed!')</script>";
            echo "<script language='javascript' type='text/javascript'>window.open('index.php','_self')</script>";
    		} 
		
		} //move uploaded
			else{
			var_dump($_POST);
            echo "<script language='javascript' type='text/javascript'>alert('Successfully Updated.')</script>";
            echo "<script language='javascript' type='text/javascript'>window.open('index.php','_self')</script>";
			} 

	?>

Thanks in advance!
Edited by hankmoody, 12 August 2014 - 05:15 PM.