3Depth

animationfunction.php

if (isset($_FILES['photo'])){
  if ($_FILES['photo']['size'] < 300007200)
{
 $pic=$_FILES['photo']['name'];
$picc=$_FILES['photo']['tmp_name'];
$tar="images/".$pic;
move_uploaded_file($picc,$tar);
 $fileName = $_FILES['photo']['name'];
function animationWriteFrames($filename, $format="frame%0d.gif", $destination="")
{
	try
	{
		$animation = new Imagick($filename);
		$coalesced = $animation->coalesceImages();
		$total = $coalesced->getNumberImages();
		foreach ($coalesced as $frame)
		{
			$index = 1 + $frame->getImageIndex();
			$tofilename = "userimages/".$_FILES['photo']['name']."".$index.".png";
			$frame->writeImage($tofilename);
		}
	}
	catch(Exception $e)
	{
		echo $e->GetMessage(), "\n";
		return FALSE;
	}
	return TRUE;
}

backgroundremoval.php

<?php
	/* Created new Imagick object and read the image in as well as variables, segment not shown */
	
//

	$pixel = $im->getImagePixelColor($x, $y);
	$im->paintTransparentImage($pixel, $hexcolor, $fuzz);
	$im2->compositeImage($im3, imagick::COMPOSITE_OVER, "".$_GET[positionleft]."", "-10");
	$im2->compositeImage($im, imagick::COMPOSITE_OVER, 0, 0);
	
	if(save){
		$im2->writeImage("resultingimages/".$_GET[q]."");
	}

	header("Content-Type: image/" . $im2->getImageFormat());
	echo $im2;
	?>

FAQ

//

style.css

 
@-webkit-keyframes button {0%}
 
25% {
	-webkit-transform: scale(1.08,1.08) skew(0deg,2deg);
	box-shadow: 0px 12px 18px rgba(0, 0, 0, 0.08);
 }
 
50% {
	-webkit-transform: scale(0.92,0.92) skew(2deg,0deg);
	box-shadow: 0px 0px 0px 0px;
 }
 
100% {-webkit-transform: scale(1,1) skew(0deg,0deg);}
 
{}
 
@keyframes button {0%}
 
25% {
	transform: scale(1.08,1.06) skew(0deg,2deg);
	box-shadow: 0px 12px 18px rgba(0, 0, 0, 0.08);
 }
 
50% {
	transform: scale(0.92,0.92) skew(2deg,0deg);
	box-shadow: 0px 0px 0px 0px;
 }
 
100% {transform: scale(1,1) skew(0deg,0deg);}
 
{}
 
@-webkit-keyframes zoomin {0%}
 
20% {
	-webkit-transform: scale(0.8,0.8);
	opacity: 0;
 }
 
100% {
	-webkit-transform: scale(1,1);
	opacity: 1;
 }
 
{}
 
div {-webkit-font-smoothing: antialiased;}
 
span {-webkit-font-smoothing: antialiased;}
 
button {
	-webkit-font-smoothing: antialiased;
	outline: 0;
	cursor: pointer;
 }
 
	button:hover {
		-webkit-animation: button 0.4s;
		animation: button 0.4s;
	 }
 
#content {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 1000px;
	background-color: #ccdbe1;
	text-align: center;
 }
 
	#content > div:first-of-type {
		width: 97.4%;
		text-align: left;
		margin: auto;
		position: relative;
		margin-top: 24px;
	 }
 
		#content > div:first-of-type > button:first-of-type {
			padding: 12px;
			padding-left: 24px;
			padding-right: 24px;
			font-family: 'Varela Round';
			font-size: 16px;
			font-weight: 600;
			background-color: #FFFFFF;
			border: 2px solid #FFFFFF;
			border-radius: 40px;
			color: #3eaac3;
			box-shadow: 0px 8px 16px -8px rgba(0, 0, 0, 0.08);
		 }
 
		#content > div:first-of-type > button:nth-of-type(2) {
			padding: 12px;
			padding-left: 24px;
			padding-right: 24px;
			font-family: 'Varela Round';
			font-size: 16px;
			font-weight: 600;
			background-color: #F5837D;
			border: 2px solid #F5837D;
			border-radius: 40px;
			color: #FFFFFF;
			float: right;
			box-shadow: 0px 8px 16px -8px rgba(0, 0, 0, 0.08);
		 }
 
		#content > div:first-of-type > button:nth-of-type(3) {
			padding: 12px;
			padding-left: 24px;
			padding-right: 24px;
			font-family: 'Varela Round';
			font-size: 16px;
			font-weight: 600;
			background-color: #FFFFFF;
			border: 2px solid #FFFFFF;
			border-radius: 40px;
			color: #97b6a0;
			box-shadow: 0px 8px 16px -8px rgba(0, 0, 0, 0.08);
			float: right;
			margin-right: 24px;
		 }
 
	#content > div:nth-of-type(2) {
		width: 97.4%;
		height: 60px;
		background-color: #FFFFFF;
		position: relative;
		box-shadow: 0px 18px 24px -12px rgba(0, 0, 0, 0.2);
		margin: auto;
		text-align: left;
		overflow: hidden;
		margin-top: 24px;
	 }
 
		#content > div:nth-of-type(2) > img:first-of-type {
			height: 60px;
			margin-left: 36px;
			margin-right: 36px;
			float: left;
			cursor: pointer;
		 }
 
		#content > div:nth-of-type(2) > div {
			padding: 22px;
			padding-left: 36px;
			padding-right: 36px;
			font-family: 'Varela Round';
			color: #828d9a;
			font-size: 14px;
			font-weight: 600;
			border-left: 1px solid #d3dcdd;
			float: left;
			background-color: #FFFFFF;
			cursor: pointer;
			letter-spacing: 1px;
		 }
 
			#content > div:nth-of-type(2) > div:hover {
				color: #3eaac3;
				border-left: 1px solid #d3dcdd;
				background-color: #f0f8f9;
			 }
 
	#content > div:nth-of-type(3) {
		background-color: #2694c3;
		background-image: url('http://get-frisbee.com/ezgif-1701745990.gif');
		background-size: auto 400px;
		background-repeat: no-repeat;
		background-position: top right;
		width: 96%;
		height: 400px;
		position: relative;
		box-shadow: 0px 18px 24px -12px rgba(0, 0, 0, 0.2);
		margin: auto;
		text-align: left;
		margin-top: 24px;
		-webkit-animation: zoomin 4s;
	 }
 
		#content > div:nth-of-type(3) > div:first-of-type {
			position: absolute;
			top: 0px;
			right: 580px;
			width: 40px;
			height: 400px;
			background: #2694c3;
		 }
 
	#content > div:nth-of-type(4) {
		width: 96%;
		text-align: left;
		margin: auto;
		background-color: #f0f8f9;
		position: relative;
		box-shadow: 0px 18px 24px -12px rgba(0, 0, 0, 0.2);
		-webkit-animation: zoomin 4s;
	 }
 
	#content > div:nth-of-type(5) {
		width: 97.4%;
		text-align: left;
		margin: auto;
		background-color: #3eaac3;
		position: relative;
		box-shadow: 0px 18px 24px -12px rgba(0, 0, 0, 0.2);
		margin-top: 48px;
	 }
 
	#content > div:nth-of-type(6) {
		width: 97.4%;
		text-align: left;
		margin: auto;
		background-color: #2cafe4;
		position: relative;
		box-shadow: 0px 18px 24px -12px rgba(0, 0, 0, 0.2);
		margin-top: 24px;
	 }