CODEWITHSUNDEEP
phpjqueryajax
Rajan Patel
Rajan Patel

Reputation: 257

how to jquery plugin in ajax call

I have one query in my php website. I want to display image on button click. Right now image is open in different webpage, but i need to open it in same webpage with some effect like imageViewer. code snippet appreciated. thanks

<script type="text/javascript">
  $(document).ready(function () {
  $("#selectedAlbumList").change(function () {
    $("#loading1").after('<div id="loader1"><img src="img/loading.gif" width="20px" height="20px" alt="loading division" /></div>');
    $.get('albumimageGet.php?albumid=' + $("#selectedAlbumList").val() + ' ', function (data) {
      $("#galleryData").html(data);
      $('#loader1').slideUp(200, function ()
                            {
        alert(data);
        $(this).remove();
      });
    });
  });
});
</script>

//albumimageGet.php

<div class="gallery" data-toggle="lightbox-gallery">
  <div class="row">
    <?php
while ($row = mysql_fetch_array($query)) {
?>
    <div class="col-sm-4 gallery-image">
      <img src="json/uploads/<?php echo $username; ?>/<?php echo $albumname; ?>/<?php echo $row['imagename']; ?>" alt="image" height="200" width="350">
      <div class="gallery-image-options text-center">
        <div class="btn-group btn-group-sm">
          <a href="json/uploads/<?php echo $username; ?>/<?php echo $albumname; ?>/<?php echo $row['imagename']; ?>" class="gallery-link btn btn-sm btn-alt btn-default" title="Image Info">View</a>
          <a href="deleteImage.php?albumid=<?php echo $albumid; ?>&imagename=<?php echo $row['imagename']; ?>" class="btn btn-sm btn-alt btn-default" data-toggle="tooltip" title="Delete" style="height:30px;"><i class="fa fa-trash-o"></i></a>
        </div>
      </div>
    </div>
    <?php
}
?> 
  </div>
</div>

Upvotes: 0

Views: 43

Answers (2)

Tejas Patel
Tejas Patel

Reputation: 870

If you have still have confusion in upper code then this will definitely worked.

mark explain so good in this example.

https://stackoverflow.com/a/21493814/4852079

Upvotes: 1

Tejas Patel
Tejas Patel

Reputation: 870

You can try this function to zoom or resize the image... try it.... hope this will work 

/*creates thumbnail of required dimensions*/
function createThumbnailofSize($sourcefilepath,$destdir,$reqwidth,$reqheight,$aspectratio=false)
{
/*
 * $sourcefilepath =  absolute source file path of jpeg
 * $destdir =  absolute path of destination directory of thumbnail ending with "/"
 */
$thumbWidth = $reqwidth; /*pixels*/
$filename = split("[/\\]",$sourcefilepath);
$filename = $filename[count($filename)-1];
$thumbnail_path = $destdir.$filename;
$image_file = $sourcefilepath;

$img = imagecreatefromjpeg($image_file);
$width = imagesx( $img );
$height = imagesy( $img );

// calculate thumbnail size
$new_width = $thumbWidth;
if($aspectratio==true)
{
    $new_height = floor( $height * ( $thumbWidth / $width ) );
}
else
{
    $new_height = $reqheight;
}

// create a new temporary image
$tmp_img = imagecreatetruecolor( $new_width, $new_height );

// copy and resize old image into new image
imagecopyresized( $tmp_img, $img, 0, 0, 0, 0, $new_width, $new_height, $width, $height );

// save thumbnail into a file

$returnvalue = imagejpeg($tmp_img,$thumbnail_path);
imagedestroy($img);
return $returnvalue;
}

Upvotes: 0

Related Questions