Click to See Complete Forum and Search --> : How do I get this to work?
jochem
11-08-2003, 11:10 AM
I am working on a page where webdesigners can test their sites at different resolutions. However, a few issues keep the used form from working properly:
:confused: 1st In the top section, users can enter either an external URL or browse for a local file. Both work fine seperately, but when combined in one form they fail.
:confused: 2nd Selecting an item from the drop-down box does not open the desired page. Actually, I'd rather have the selected option confirmed by pressing the “Test” button. Or, even better, by selecting an item the “width” and “height” fields would be filled out automatically, whereafter one would press “Test” to open the new window.
:confused: 3rd The new window is loaded behind the current one. I would like it to be loaded on top of it.
An online version of this page can be found at www.alpinetrekking.com/canvas. Right-click to see the code. I left out the “browse” section to get it to work. The browse section looks like this:
<table border="0" cellpadding="0" cellspacing="0">
<form name="ResolutionTester" method="post" onSubmit="javascript:return false" enctype="multipart/form-data">
<tr><td colspan="3" ><b>Enter an URL <i><u>or</u></i> browse for a local file</b></td></tr>
<tr><td colspan="2" ><input type="text" name="testURL" class="input1" value="http://" /></td>
<td ><input type="reset" name="reset" class="button0" value="Reset" /></td></tr>
<tr><td colspan="3" ><input type="file" name="testURL" class="browse" /></td></tr>
.... more coding here, like </table> and </form>
Any ideas? Your help would be very much appreaciated.
Cheers, Jochem :cool:
96turnerri
11-08-2003, 06:35 PM
<select class="select" name="Odds" onChange="javascript:jumpBox()">
<option name="void" value="0" >Odd resolutions
<option name="160x160" value="Test2('160','160')">160x160 : PalmOS
<option name="176x160" value="Test2('176','160')">176x160 : Cell phone
<option name="320x240" value="Test2('320','240')">320x240 : PocketPC
<option name="320x320" value="Test2('320','320')">320x320 : PalmOS Hi
<option name="640x240" value="Test2('640','240')">640x240 : WinCE
<option name="544x372" value="Test2('544','372')">544x372 : WebTV
</select></td>
make the value=372x234 or whatevr not the test2 bit there you redirecting url bit gone working on other bits
jochem
11-08-2003, 06:44 PM
Thanx for your reply!
But it needs to know what to do, something like a function. In this case: open a chromeless window with the set resolution.
Any idea for the browse / URL combination?
96turnerri
11-09-2003, 06:54 AM
i know its early in the morning but i cant see a browse feature on this site
jochem
11-09-2003, 07:00 AM
True. As I wrote in my first message, I took out that part for the online version. Just paste the code from my first message inside the script, and you'll see the browse part.
Thanks for getting into it!
Cheers, Jochem :cool:
jochem
11-10-2003, 08:42 AM
Well, I've worked my way around for the "browse" and "enter url" part, by combining them in one input field. Works just fine although I miss the option of entering a default value, like "http://".
See the result at www.alpinetrekking.com/canvas
Still, I'd rather have two lines to do the job, so I am very much open for any suggestions on that!!
What remains to be solved are part 2 and part 3 of my question in this forum:
:confused: 2nd The "Odd resolution" drop down box. How do I get it to fill out the two fields to the left of it? Or, if filling out is impossible, how do I get it to load the right (chromeless) page?
:confused: 3rd How do I get the opened windows to pop up in stead of pop under?
Cheers, Jochem :cool:
jochem
11-10-2003, 10:09 AM
I'm getting closer... I found a piece of HTML that does fill in a form field from a link:
<html>
<body>
<div align="center">
<table border="2" width="280" cellspacing="5" cellpadding="15" bordercolor="#000000">
<tr>
<td width="239" bgcolor="#00FF00">
<form name="resize">
<input name="xval" size="5" value="640" class="forms"> Window Width<br>
<input name="yval" size="5" value="480" class="forms"> Window Height
</form>
<p align="center">
<a href="#" onclick="document.resize.xval.value='640',document.resize.yval.value='480'">640x480</a>,
<a href="#" onclick="document.resize.xval.value='800',document.resize.yval.value='600'">800x600</a>,
<a href="#" onclick="document.resize.xval.value='1024',document.resize.yval.value='768'">1024x768</a>,
<a href="#" onclick="document.resize.xval.value='1280',document.resize.yval.value='1024'">1280x1024</a>,
<a href="#" onclick="document.resize.xval.value='1400',document.resize.yval.value='1050'">1400x1050</a>,
<a href="#" onclick="document.resize.xval.value='1600',document.resize.yval.value='1200'">1600x1200</a>
</p>
</td></tr>
</table>
</div>
</body>
</html>
Now I need to know how to apply this to a drop-down box. I tried this, but it doesn't work:
<p align="center">
<select class="select">
<option>Odd resolutions</option>
<option onselect="document.resize.xval.value='160',document.resize.yval.value='160'">160x160 : PalmOS</option>
<option onselect="document.resize.xval.value='176',document.resize.yval.value='160'">176x160 : Cell phone</option>
<option onselect="document.resize.xval.value='320',document.resize.yval.value='240'">320x240 : PocketPC</option>
<option onselect="document.resize.xval.value='320',document.resize.yval.value='320'">320x320 : PalmOS Hi</option>
<option onselect="document.resize.xval.value='640',document.resize.yval.value='240'">640x240 : WinCE</option>
<option onselect="document.resize.xval.value='544',document.resize.yval.value='372'">544x372 : WebTV</option>
</select>
</p>
Cheers, Jochem :cool:
96turnerri
11-10-2003, 10:53 AM
you must call the xval or resize the same as what the boxes are called on your site
jochem
11-10-2003, 11:37 AM
I agree, but it won't even work outside my site, which is what I am trying to achieve first. This is a test script on it's own.
By the way, what do you think of the easy solution for the browse/input field combination? Have you got any other suggestions?
Thanks for looking into it!
jochem
11-10-2003, 04:00 PM
I'm almost there. Someone on the HTML forum helped me out. Now I need to implement this script into my own page.
<html>
<head>
<title>Test</title>
<script language="JavaScript">
function chgval(objval)
{
splitval=objval.split(",")
document.resize.xval.value=splitval[0]
document.resize.yval.value=splitval[1]
}
</script>
</head>
<body>
<div align="center">
<table border="2" width="280" cellspacing="5" cellpadding="15" bordercolor="#000000">
<tr>
<td width="239" bgcolor="#00FF00">
<form name="resize">
<input type="text" name="xval" size="5" value="640" class="forms"> Window Width<br>
<input type="text" name="yval" size="5" value="480" class="forms"> Window Height
</form>
<select name="sel1" onChange="chgval(this.options[this.selectedIndex].value)">
<option value="640,480">640x480</option>
<option value="800,600">800x600</option>
</select>
</td></tr>
</table>
</div>
</body>
</html>
All that's left now is to get the pages as a pop up in stead of pop under. Who'sgonna help me out here?
Cheers, Jochem :cool:
96turnerri
11-10-2003, 06:06 PM
so whats the problem now jochem just merge the two scripts together piece cake right?
jochem
11-10-2003, 06:16 PM
I did and it works. It's online now at www.alpinetrekking.com/canvas.
All that's left is to get the page to pop up in stead of under. Any suggenstions?
Cheers, Jochem :cool:
jochem
11-10-2003, 06:18 PM
One dot too much... Try http://www.alpinetrekking.com/Canvas/