Systematically updating src of IMG. Memory leak

Systematically updating src of IMG. Memory leak.

I am currently updating an image every x sec. A few ways I thought of doing this were as follows:

Take One:

var url ="...";
$('#ImageID').attr('src', url);

Now this works perfectly changes the image but causes a memory leak.

Take Two:

So it is creating DOM elements, so I attempted the following.

<div id="ImageHolder">

</div>

var image - "..."; //Obv actual image in working.

$('#ImageHolder').empty();
$('#ImageHolder').html(image);

Now this works but causes a flicker when it changes which is unliked. Now with two images and swapping them at intervals works fine, but I want to stay as low on bandwidth as possible.

Edit 1:

My Code:

<form name="selected">
<input type="hidden" name="map" />
</form>

<img id="MyMaps" src="http://localhost/web/blank.png" alt="" />


<script type="text/javascript">
var locate = window.location;
var uri = document.selected.map.value;

var MyHost = window.location.hostname;
    function delineate2(name) {
        totheleft= uri.indexOf("maps/") + 5;
        totheright= uri.lastIndexOf("&");
        return (uri.substring(totheleft, totheright));
    }

    function loadImage() {
        var CurrentMap = delineate2(name);
        var url = 'http://' + MyHost+ '/map/' + CurrentMap+ '/image?' + new Date().getTime();

        $('#MyMaps').attr('src', url);

        setTimeout(loadImage, 10000);
    }
</script>

Has anyone done something similar and found a working solution, or how can I go about preventing the memory leak / flickering when the image updates?

5
задан Sphvn 10 September 2010 в 05:09
поделиться