jQuery --> get (calculate) image WIDTH and HEIGHT and write attributes for any image. [SOLVED]
<p>I'm using jScrollPane and I had some issues in Chrome and Safari with the height of the scrollable area.</p>

<p>To make jScrollPane work I have to set HEIGHT and WIDTH for any image inside the scrollable area.</p>

<p>No problem with .css but what if one image is Ex: in portrait mode?
To avoid setting width and height manually I realized... jQuery! :)</p>

<p>For now I have something like this:</p>

<pre><code>imageWidth = $('.scroll_pane img').width();
imageHeight = $('.scroll_pane img').height();   
$('.scroll_pane img').css({'width': imageWidth, 'height': imageHeight});
</code></pre>

<p>That is half correct (I suppose) as now from:</p>

<pre><code>&lt;img src="some/url/image.jpg"/&gt;
</code></pre>

<p>on DOM ready I get this:</p>

<pre><code>&lt;img src="some/url/image.jpg" style="width: 120px; height: 220px"/&gt;
</code></pre>

<p>For the first image. The problem is that now all the other images have the same styles.</p>

<p>How to make EACH image write to it self his own styles?</p>

<p><strong>EDIT:</strong></p>

<p><strong>Solution, thx to Cybernate (and Capsule for future suggestions.):</strong></p>

<pre><code>$(window).load(function () { 
    $('.scroll_pane').jScrollPane();

    $('.scroll_pane img').each(function(){    
        var $this = $(this);   
        var imageWidth = $this.width();   
        var imageHeight = $this.height();        
        $this.css({'width': imageWidth, 'height': imageHeight}); 
    }); 
});
</code></pre>

<p>Now calculates automatically images styles and finally jScrollPane works in Safari and Opera!</p>
