how to create animated image?

Question

Possible Duplicate:
PHP - Create simple animated GIF from two JPEG images?

I have a simple jpg image, and I want to create animated image with it.

Can anyone suggest me any ideas?

i have idea about imagegif(). But that is not what i need. I want to create a image that moves from that simple jpg image. Is it possible.

I've thought about imagegif(), but that was not what I needed. I want to create a moving image from JPG image, if it's possible.

Any help will be highly appreciated.

Thank you.

Answer 1

Just go through this website and upload 2,3,4.5 as many pictures you like for sequencing.

Try it

picasion.com

with regards,

Wasim

Answer 2

You can use gifmerge class its easy

Try me !

Answer 3

Use this code in your css file.

#animation {
  -webkit-animation-name: pulse;
  -webkit-animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-direction: alternate;
}

And in html...

<div id="animation">
    <img src="your image with path">
</div>

If your browser is Mozilla Firefox, replace -webkit- with -moz-.

Have fun...

Answer 4

It's not totally clear what you're looking for from the question, but if what you want is to take a single image and make it an animated one, you have a couple of options:

1. Animate it in some algorithmic way (for example a "wave" effect or "underwater" effect)
2. Manually create multiple frames based on it with subtle variation from one to the next (in PHotoshop, GIMP, etc)

The most interesting of these options from a programming standpoint is #1 (for #2 - yes, all you'd need is something like imagegif).

You could use ImageMagick distortion effects via PHP via the IMagick PHP interface to ImageMagick. What you'd want is to pick a distortion method there (there are plenty), then run it against the source image several times with slightly varied parameters, to produce different frames. After this, you can combine the resulting frames with imagegif() or similar.

Answer 5

This cannot be done with GD but I found a great library for it. It is a bit complicated though, so here is a link to the library which makes animated gifs with php. It explains how to use it thoroughly. http://www.phpclasses.org/package/3163-PHP-Generate-GIF-animations-from-a-set-of-GIF-images.html

You can look at my example using this library here: http://cmon.horizon-host.com/gifs/slideshow_normal.php On the site just select 2 pictures and write 100 for speed 900 for width and height. It will put them in an animated gif slideshow.

Here is the code for that script:

<?php
if(isset($_POST['speed']))
{
    header('Content-type: image/gif');
    if(isset($_POST['download'])){
    header('Content-Disposition: attachment; filename="animated.gif"');
    }
    include('GIFEncoder.class.php');
    function frame($image){
        ob_start();
        imagegif($image);
        global $frames, $framed;
        $frames[]=ob_get_contents();
        $framed[]=$_POST['speed'];
        ob_end_clean();
    }
    foreach ($_FILES["images"]["error"] as $key => $error)
    {
        if ($error == UPLOAD_ERR_OK)
        {
            $tmp_name = $_FILES["images"]["tmp_name"][$key];
            $im = imagecreatefromstring(file_get_contents($tmp_name));
            $resized = imagecreatetruecolor($_POST['width'],$_POST['height']);
            imagecopyresized($resized, $im, 0, 0, 0, 0, $_POST['width'], $_POST['height'], imagesx($im), imagesy($im));
            frame($resized);
        }
    }
    $gif = new GIFEncoder($frames,$framed,0,2,0,0,0,'bin');
    echo $gif->GetAnimation();
}
?>
<form action="" method="post" enctype="multipart/form-data">
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="jquery.MultiFile.js"></script>
<script src="jquery.placeholder.js"></script>
<input type="file" name="images[]" class="multi" />
<script>
    $(function(){
        $('input[placeholder], textarea[placeholder]').placeholder();
   });
</script>
   <SCRIPT language=Javascript>
      <!--
      function isNumberKey(evt)
      {
         var charCode = (evt.which) ? evt.which : event.keyCode
         if (charCode > 31 && (charCode < 48 || charCode > 57))
            return false;

         return true;
      }
      //-->
   </SCRIPT>
<input name="speed" maxlength="10" type="text" placeholder="Speed of frames in ms" onkeypress="return isNumberKey(event)">
<input name="width" maxlength="4" type="text" placeholder="Width" onkeypress="return isNumberKey(event)">
<input name="height" maxlength="4" type="text" placeholder="Height" onkeypress="return isNumberKey(event)">
<input type="submit" name="download" value="Download!">
<input type="submit" name="preview" value="Preview!">
</form>

As you see it references the GIFEncoder class found on the first link. It also uses some javascript validation and jQuery multiupload.

Note: this question has already been asked.