Dynamical Image loaded from php after javascript need to run

Question

I have page with image loading Dynamical from php.The image height is various px size(70,130,100,60).my need is how can get the image size currently viewed in page automatically in alertbox i try same code is not working.please help

code

<?php
foreach ($images as $image) { 
    ?>
<img src="<?php echo $image['url']; ?>" class="img_test" id="<?php echo $image['url']; ?>" width="70" style="max-height:70px" onclick="imagesize(this)" />
<?php
}?>

<script>
       $( window ).load(function() {

        $( ".img_test" ).each(function( index ) {
            alert('Height: '+$(this).height());
        });
       });
       function imagesize(obj){
           alert($(obj).height());
       }
</script>

if we click the image the height will display.in page load after automatically can't be display

My concept is align the image from his height.the width is standard is 70,the height of the image is not,when align the image get the height after completely image load in that css class. — Raj Mohan
– Raj Mohan, Commented Sep 27, 2013 at 10:54

Donovan Charpin · Accepted Answer · 2013-09-27 10:34:00Z

2

It's important to understand that it's navigator (client) which load image and PHP is running into your server and send text to client.

Use a listener .on to get event 'click'.

Moreover, use $(document).ready and not .load to wait that images are loading

<?php foreach ($images as $image) { ?>
    <img src="<?php echo $image['url']; ?>" class="img_test" id="<?php echo $image['url']; ?>" width="70" style="max-height:70px" />
<?php } ?>


$(document).ready(function(){
    $( ".img_test" ).each(function(){
        alert('Height: '+$(this).height());
    });

    $(".img_test").on("click", function(){
           alert($(this).height());
    });
});

http://jsfiddle.net/3c9CN/

answered Sep 27, 2013 at 10:34

Donovan Charpin

3,40725 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Pete Over a year ago

i would use $(window).load instead of $(document).ready as your images may not have fully loaded and will give you a false height. $(document).ready only waits until all the html is parsed where as $(window).load will wait until all the objects are loaded

Raj Mohan Over a year ago

but that also i have checked there is no result,the image take automatically height that height need to alert.

Collectives™ on Stack Overflow

Dynamical Image loaded from php after javascript need to run

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related