siva_siva
asked on
Display drop down menu according to the screen width
Display drop down menu according to the screen width in IE7
MM_showMenu(window.mm_menu _1,(screen .width/2), (screen.he ight/2),nu ll,'spacer 1')
for example
for example
ASKER
It's not functioning. It doesn't replace the screen width value
sorry. Not enough information.
The code I gave you gives the HALF of the screen width and height
Remove the /2 to get the screen width and height
The code I gave you gives the HALF of the screen width and height
Remove the /2 to get the screen width and height
ASKER
Ya. I am also know that function. But we got the screen width value in javascript variable. But i want to check condition in coldfusion. How will i assign javascript variable to coldfusion variable.
You do not.
on the previous screen you can do something like
<a href="nextpage.cf" onClick="this.href='nexpag e.cf?scree nw='+scree n.width+'& screenh='+ screen.hei ght">...
on the previous screen you can do something like
<a href="nextpage.cf" onClick="this.href='nexpag
ASKER
I want this code for index page. It is main problem. Otherwise we can solve it through query string
ASKER
I want dynamic drop down menu but display correctly in all screen resolution.
I do not understand what you need.
If you are not referring to the code
MM_showMenu(window.mm_menu _1,340,140 ,null,'spa cer1');"
then what code are you referring to?
If you are not referring to the code
MM_showMenu(window.mm_menu
then what code are you referring to?
ASKER
Yes. I am referring that code.
In this 340 pixels is left from the screen and 140 pixels is top from the screen. I want to change the 340 pixels value dynamically with screen resolution.
In this 340 pixels is left from the screen and 140 pixels is top from the screen. I want to change the 340 pixels value dynamically with screen resolution.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Ok.. But what is the ratio between each screen width.
340 is for 1024px.
what value will be given to 800, 1200, 1600 etc...
340 is for 1024px.
what value will be given to 800, 1200, 1600 etc...
You decide!
How can I decide?
I have no idea how your page looks.
I just gave some numbers for you to change to what you need them to be....
How can I decide?
I have no idea how your page looks.
I just gave some numbers for you to change to what you need them to be....
ASKER
Is there any common ratio?
How many screen width range like 800, 1024 etc..?
How many screen width range like 800, 1024 etc..?
>>Is there any common ratio?
yes and no
for standard screens the ratio is about 1:1.3 for wide screens the ratio is 1:1.6 (the golden mean/golden ratio [or close enough]), burt using this typoe of calculation to place the menu is not the best idea, what you need to do is determine the screen resolutionj and apply a complete style sheet, othewise as you move teh menu around you might place it over othe page items. it is not jus tmenu placement you will need to adjust if you go this route but also your entire page/site
yes and no
for standard screens the ratio is about 1:1.3 for wide screens the ratio is 1:1.6 (the golden mean/golden ratio [or close enough]), burt using this typoe of calculation to place the menu is not the best idea, what you need to do is determine the screen resolutionj and apply a complete style sheet, othewise as you move teh menu around you might place it over othe page items. it is not jus tmenu placement you will need to adjust if you go this route but also your entire page/site
ASKER
i cant understand please give an example with my code please
something like this maybe
<script language="JavaScript" type="text/javascript">
var iScreenWidth=screen.width;
var iScreenHeight=screen.heigh t;
if(iScreenWidth==800 && iScreenHeight==600){
document.write('<link rel="STYLESHEET" type="text/css" href="/css/styles_800_600. css?versio n=#Now()#" />');
}else if(iScreenWidth==1024 && iScreenHeight==768){
document.write('<link rel="STYLESHEET" type="text/css" href="/css/styles_1024_768 .css?versi on=#Now()# "/>');
}else{
document.write('<link rel="STYLESHEET" type="text/css" href="/css/styles_default. css?versio n=#Now()#" />');
}
</script>
<script language="JavaScript" type="text/javascript">
var iScreenWidth=screen.width;
var iScreenHeight=screen.heigh
if(iScreenWidth==800 && iScreenHeight==600){
document.write('<link rel="STYLESHEET" type="text/css" href="/css/styles_800_600.
}else if(iScreenWidth==1024 && iScreenHeight==768){
document.write('<link rel="STYLESHEET" type="text/css" href="/css/styles_1024_768
}else{
document.write('<link rel="STYLESHEET" type="text/css" href="/css/styles_default.
}
</script>
Or simpler
<script>
var w = screen.width;
var css = 'default'; // default
if (w <= 800) {
css = "small";
}
else if (w <= 1024) {
css = "default"; // whatever
}
else if (w <= 1200) {
css = "large";
}
document.write('<link rel="STYLESHEET" type="text/css" href="'+css+'.css" />');
</script>
No need to test both width and height. The width is more likely to fluctuate (widescreen) than the height
<script>
var w = screen.width;
var css = 'default'; // default
if (w <= 800) {
css = "small";
}
else if (w <= 1024) {
css = "default"; // whatever
}
else if (w <= 1200) {
css = "large";
}
document.write('<link rel="STYLESHEET" type="text/css" href="'+css+'.css" />');
</script>
No need to test both width and height. The width is more likely to fluctuate (widescreen) than the height
i know you would have a better version michel
but i would still add ?version=#Now()# to the end, this forces a download of the latest css
but i would still add ?version=#Now()# to the end, this forces a download of the latest css
Or
document.write('<link rel="STYLESHEET" type="text/css" href="'+css+'.css?version' +Math.rand om()+'" />');
to stay on the client
document.write('<link rel="STYLESHEET" type="text/css" href="'+css+'.css?version'
to stay on the client
ASKER
Thanks to all
ASKER
In this i am using 340 and 240 as statically. I want the code dynamically for screen size or screen width