Loading Image without refreshing

[BN]

Hello..:)

Is it possible to load and show a JPG file using Javascript...?

I have a HTML document, and want to load a new image when the user pushes a
button.

Thanx..

--


Best Regards,

BN - [E A Rosengrens AS]

[Michael Winter]

Re: Loading Image without refreshing

On Sat, 17 Jan 2004 16:37:14 GMT, BN <tnoestda@enter .vg> wrote:
[color=blue]
> Is it possible to load and show a JPG file using Javascript...?
>
> I have a HTML document, and want to load a new image when the user
> pushes a button.[/color]

Do you mean you want to change the source (src attribute) of an existing
IMG element when a user presses a button? If so, then yes, it can be done
as long as you accept the fact that a user with JavaScript disabled cannot
use this feature in your page.

Place this somewhere before the button below (HEAD or BODY):

<SCRIPT type="text/javascript">
function changeImage( element, URI ) {
var img = null;

if( document.getEle mentById ) {
img = document.getEle mentById( element );
} else if( document.all ) {
img = document.all[ element ];
}
if( img ) {
img.src = URI;
}
}
</SCRIPT>

In the BODY of your document:

<IMG id="giveMeAUniq ueID" src="initialIma ge.jpg">
...
<BUTTON type="button"
onclick="change Image('giveMeAU niqueID','newIm age.jpg')"[color=blue]
>Change image</BUTTON>[/color]

replacing the two filenames and the ID name with your own values.

This will only allow the image to be changed once. Cycling between two or
more images, in sequential or random order, is equally possible, but as
you didn't ask for it, you're not getting it[1]. :P

Mike


[1] Obviously, ask if you do need such a feature.

--
Michael Winter
M.Winter@blueyo nder.co.invalid (replace ".invalid" with ".uk" to reply)

[BN]

Re: Loading Image without refreshing

Thanx, I will try this..

Is there also a way of handeling if the file does not excist...?

or to be exact:

My filenames consist of 2 or 4 characters. If a button loads the picture
2341.jpg and that image does not excist at the moment, I want 2300.jpg to be
loaded. And if 4356.jpg does not excist, I want to load 4300.jpg. ( The
first two bytes of the name + 00 )

--


Best Regards,

BN - [E A Rosengrens AS]
"Michael Winter" <M.Winter@bluey onder.co.invali d> skrev i melding
news:opr1xj2dzk 5vklcq@news-text.blueyonder .co.uk...[color=blue]
> On Sat, 17 Jan 2004 16:37:14 GMT, BN <tnoestda@enter .vg> wrote:
>[color=green]
> > Is it possible to load and show a JPG file using Javascript...?
> >
> > I have a HTML document, and want to load a new image when the user
> > pushes a button.[/color]
>
> Do you mean you want to change the source (src attribute) of an existing
> IMG element when a user presses a button? If so, then yes, it can be done
> as long as you accept the fact that a user with JavaScript disabled cannot
> use this feature in your page.
>
> Place this somewhere before the button below (HEAD or BODY):
>
> <SCRIPT type="text/javascript">
> function changeImage( element, URI ) {
> var img = null;
>
> if( document.getEle mentById ) {
> img = document.getEle mentById( element );
> } else if( document.all ) {
> img = document.all[ element ];
> }
> if( img ) {
> img.src = URI;
> }
> }
> </SCRIPT>
>
> In the BODY of your document:
>
> <IMG id="giveMeAUniq ueID" src="initialIma ge.jpg">
> ...
> <BUTTON type="button"
> onclick="change Image('giveMeAU niqueID','newIm age.jpg')"[color=green]
> >Change image</BUTTON>[/color]
>
> replacing the two filenames and the ID name with your own values.
>
> This will only allow the image to be changed once. Cycling between two or
> more images, in sequential or random order, is equally possible, but as
> you didn't ask for it, you're not getting it[1]. :P
>
> Mike
>
>
> [1] Obviously, ask if you do need such a feature.
>
> --
> Michael Winter
> M.Winter@blueyo nder.co.invalid (replace ".invalid" with ".uk" to reply)[/color]

[Michael Winter]

Re: Loading Image without refreshing

On Sat, 17 Jan 2004 18:43:07 GMT, BN <tnoestda@enter .vg> wrote:
[color=blue]
> Is there also a way of handeling if the file does not excist...?[/color]

Not that I know of[1].

Mike


[1] That doesn't necessarily mean there isn't a way.

--
Michael Winter
M.Winter@blueyo nder.co.invalid (replace ".invalid" with ".uk" to reply)

[Brynn]

Re: Loading Image without refreshing


You would have to use server side coding to do this .. like asp.




On Sat, 17 Jan 2004 18:43:07 GMT, "BN" <tnoestda@enter .vg> wrote:
[color=blue]
>Thanx, I will try this..
>
>Is there also a way of handeling if the file does not excist...?
>
>or to be exact:
>
>My filenames consist of 2 or 4 characters. If a button loads the picture
>2341.jpg and that image does not excist at the moment, I want 2300.jpg to be
>loaded. And if 4356.jpg does not excist, I want to load 4300.jpg. ( The
>first two bytes of the name + 00 )
>
>--
>
>
>Best Regards,
>
>BN - [E A Rosengrens AS]
>"Michael Winter" <M.Winter@bluey onder.co.invali d> skrev i melding
>news:opr1xj2dz k5vklcq@news-text.blueyonder .co.uk...[color=green]
>> On Sat, 17 Jan 2004 16:37:14 GMT, BN <tnoestda@enter .vg> wrote:
>>[color=darkred]
>> > Is it possible to load and show a JPG file using Javascript...?
>> >
>> > I have a HTML document, and want to load a new image when the user
>> > pushes a button.[/color]
>>
>> Do you mean you want to change the source (src attribute) of an existing
>> IMG element when a user presses a button? If so, then yes, it can be done
>> as long as you accept the fact that a user with JavaScript disabled cannot
>> use this feature in your page.
>>
>> Place this somewhere before the button below (HEAD or BODY):
>>
>> <SCRIPT type="text/javascript">
>> function changeImage( element, URI ) {
>> var img = null;
>>
>> if( document.getEle mentById ) {
>> img = document.getEle mentById( element );
>> } else if( document.all ) {
>> img = document.all[ element ];
>> }
>> if( img ) {
>> img.src = URI;
>> }
>> }
>> </SCRIPT>
>>
>> In the BODY of your document:
>>
>> <IMG id="giveMeAUniq ueID" src="initialIma ge.jpg">
>> ...
>> <BUTTON type="button"
>> onclick="change Image('giveMeAU niqueID','newIm age.jpg')"[color=darkred]
>> >Change image</BUTTON>[/color]
>>
>> replacing the two filenames and the ID name with your own values.
>>
>> This will only allow the image to be changed once. Cycling between two or
>> more images, in sequential or random order, is equally possible, but as
>> you didn't ask for it, you're not getting it[1]. :P
>>
>> Mike
>>
>>
>> [1] Obviously, ask if you do need such a feature.
>>
>> --
>> Michael Winter
>> M.Winter@blueyo nder.co.invalid (replace ".invalid" with ".uk" to reply)[/color]
>
>[/color]

I participate in the group to help give examples of code. I do not guarantee the effects of any code posted. Test all code before use!

Brynn

https://www.coolpier.com