/    Sign up×
Community /Pin to ProfileBookmark

when i use my code with mozilla the next and back buttons work, but the status bar doesnt, and with netscape i can only get the pictures to change only if i use the pulldown box and i dont press ‘next’ or ‘back’
can anyone help?

[code=php]
<input type=”button” value=”Open Says Me!” onclick=”window.open(‘thing.html’,”,’width=500,height=350,resizable=no,scrollbars=no,status=yes’);”>
[/code]

and the popup…

[code=php]
<SCRIPT LANGUAGE=”JavaScript”>
<!–
function doChange(opt){
var selobj=document.getElementById(“piclist”);
var idx=selobj.selectedIndex;
if(opt==”back” && idx!=0) idx–;
if(opt==”next” && idx!=selobj.options.length-1) idx++;
document.getElementById(“mypic”).src=selobj.options[idx].value;
selobj.selectedIndex=idx;
window.status=selobj.options[idx].name;
}
//–>
</SCRIPT>
</HEAD>

<BODY BGCOLOR=”blue” link=”maroon”><center>

<p><img id=”mypic” src=”pic1.jpg”></p>
<input type=”button” value=”back” onclick=’doChange(“back”)’>

<SELECT id=”piclist” onchange=’doChange(“selected”)’>
<option value=”pic1.jpg” name=”picture 1″>Pic1</option>
<option value=”pic2.jpg” name=”picture 2″>Pic2</option>
<option value=”pic3.jpg” name=”picture 3″>Pic3</option>
<option value=”liger!.bmp” name=”Liger!!!”>Liger</option>
</SELECT>
<input type=”button” value=”next” onclick=’doChange(“next”)’>
<p><a href=’javascript:window.close();’>Close Window</a></p>
</center></BODY>
</HTML>
[/code]

please give any input you can?

to post a comment
JavaScript

30 Comments(s)

Copy linkTweet thisAlerts:
@JonaMar 15.2005 — [font=trebuchet ms]I think you have the order here wrong:[/font]

<i>
</i>document.getElementById("mypic").src=selobj.options[idx].value;
selobj.selectedIndex=idx;


[font=trebuchet ms]Shouldn't that be...[/font]

<i>
</i>selobj.selectedIndex=idx;
document.getElementById("mypic").src=selobj.options[idx].value;


[font=trebuchet ms]Also, try using [i]defaultStatus = selobjoptions[idx].name[/i]. I haven't tested it, but if [i]window.status[/i] doesn't work, it just might.[/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 15.2005 — thanks for the attempt Jona, but it doesnt seem to have done much

the 'next' and 'back' buttons now work in netscape, but once i reach the 'liger!.bmp', none of the pictures show up

and the status change was unsuccessful
Copy linkTweet thisAlerts:
@JonaMar 15.2005 — [font=trebuchet ms]Try using [i]window.status[/i] again, but at the end of the function add "return true." That's the only thing I can think of for that part. As for the "liger!.bmp" image, you shouldn't have an exclamation point in your filename, and you shouldn't be using a BMP on the Web.[/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 15.2005 — i was just trying the .bmp to see if i could incorporate images with different extentions into this
Copy linkTweet thisAlerts:
@JonaMar 15.2005 — [font=trebuchet ms]Try a JPG instead. ? [/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 15.2005 — i replaced the .bmp with a .gif and the pictures all show

but the status still doesnt work
Copy linkTweet thisAlerts:
@JonaMar 15.2005 — [font=trebuchet ms]Make sure you have your options set to allow JavaScript to change the status bar. (Tools -> Options -> Web Features tab -> Advanced.)[/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 15.2005 — its set right...

the status is saying 'undefined'... could i have defined it incorrectly somewhere?
Copy linkTweet thisAlerts:
@JonaMar 15.2005 — [font=trebuchet ms]Interesting. Give me a minute to test it.[/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 15.2005 — ok

thanks for the help Jona?
Copy linkTweet thisAlerts:
@JonaMar 15.2005 — [font=trebuchet ms]It doesn't say "undefined" for me...[/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 15.2005 — in my IE the status works, but in Mozilla and Netscape 6 i get undefined
Copy linkTweet thisAlerts:
@JonaMar 15.2005 — [font=trebuchet ms]Oops. I think I have [i]my[/i] statusbar disabled. ? [/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 15.2005 — haha... that made me chuckle
Copy linkTweet thisAlerts:
@JonaMar 15.2005 — [font=trebuchet ms]It looks like, since NAME is not a valid attribute of the OPTION element, Gecko (Netscape/Mozilla) wants to ignore its presence. Instead of using another attribute, you might want to just use this:[/font]

<i>
</i>window.status=selobj.options[idx].text;
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 15.2005 — ok time for bed... if anyone figures anything out please leave it and i'll check back in the morning

big thanks again Jona?
Copy linkTweet thisAlerts:
@JonaMar 15.2005 — [font=trebuchet ms]Happy to help.[/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 15.2005 — lol i didnt see that it went to a 2nd page..

that last bit of code works thanks a great big bunch Jona?

*bows down to your superior intelligence*

thanks again?
Copy linkTweet thisAlerts:
@JonaMar 15.2005 — [font=trebuchet ms]Oh! lol. Well, goodie gumdrops![/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 15.2005 — gosh... why didnt i try this before:p

it dawned on me when i woke up... why not switch the 'name' tags to 'id' tags?

working code:
[code=php]
<SCRIPT LANGUAGE="JavaScript">
<!--
function doChange(opt){
var selobj=document.getElementById("piclist");
var idx=selobj.selectedIndex;
if(opt=="back" && idx!=0) idx--;
if(opt=="next" && idx!=selobj.options.length-1) idx++;
selobj.selectedIndex=idx;
document.getElementById("mypic").src=selobj.options[idx].value;
window.status=selobj.options[idx].id;
return true;
}
//-->
</SCRIPT>
</HEAD>

<BODY BGCOLOR="blue" link="maroon"><center>

<p><img id="mypic" src="pic1.jpg"></p>
<input type="button" value="back" onclick='doChange("back")'>

<SELECT id="piclist" onchange='doChange("selected")'>
<option value="pic1.jpg" id="picture 1">Pic1</option>
<option value="pic2.jpg" id="picture 2">Pic2</option>
<option value="pic3.jpg" id="picture 3">Pic3</option>
<option value="whole_world.gif" id="the globe">Globe</option>
</SELECT>
<input type="button" value="next" onclick='doChange("next")'>
<p><a href='javascript:window.close();'>Close Window</a></p>
</center></BODY>
</HTML>
[/code]


thanks again to Jona for the help?
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 17.2005 — ok another question from me:p

i was wondering how to make it so that the buttons and select dont move around with the picture changing size

for example, if i could place the image in a table so something so that it can change sizes and not change the location of my buttons and select

the site can be seen [url=http://cupofjoe.bravehost.com/]here[/url].

make sure to click the button?
Copy linkTweet thisAlerts:
@JonaMar 17.2005 — [font=trebuchet ms]Just put a specific width/height on the IMG tag.[/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 17.2005 — hey Jona... i tried that and i dont think that's what im looking for

im trying to get it so that id doesnt matter what size the picture is

i actually want the picture to change to be teh correct size, i just dont want the stuff to move around

attached is a very rough draft drawing of what i'm looking for

[upl-file uuid=d4e8d0ee-68c3-4130-8873-a3027390ed4f size=18kB]layout.jpg[/upl-file]
Copy linkTweet thisAlerts:
@JonaMar 17.2005 — [font=trebuchet ms]If you specify a width/height for the IMG tag itself, all images will be resized to have that width/height. You can setup a maxmimum width/height, but I don't think JavaScript can determine the regular width/height of an image from the start. Any other way you might do it (absolute positioning, etc.) would allow the images to overlap the buttons anyway.[/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 17.2005 — jona,i know what you're thinking... but my problem is that if all of the pictures aren't the given size, it distorts them
Copy linkTweet thisAlerts:
@JonaMar 17.2005 — [i]Originally posted by cupofjoe [/i]

[B]jona,i know what you're thinking... but my problem is that if all of the pictures aren't the given size, it distorts them [/B][/QUOTE]


[font=trebuchet ms]You have a few options in that case, then. You could have a server-side script automatically resize them to scale at a specific height, assuming you have no "really small" ones. Or you could just make sure they all are the same size in the first place. I don't know how else you would even plan on doing that... Unless perhaps you had the select menu with the previous/next buttons on top instead of on bottom.[/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 17.2005 — is there a way to make like a table or something that i can make a certain size for the picture?
Copy linkTweet thisAlerts:
@JonaMar 17.2005 — [i]Originally posted by cupofjoe [/i]

[B]is there a way to make like a table or something that i can make a certain size for the picture? [/B][/QUOTE]


[font=trebuchet ms]If you set it as a background you can try something like that, but it will clip. Other than that, not that I'm aware of.[/font]
Copy linkTweet thisAlerts:
@cupofjoeauthorMar 17.2005 — ok then i'll just have to have it changing size for a while:p

thanks Jona
Copy linkTweet thisAlerts:
@JonaMar 17.2005 — [font=trebuchet ms]No prob.[/font]
×

Success!

Help @cupofjoe spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...