How to Detect screen size to wite jAuery function

Hi All,
I am using jFlow slider for my website and in the head there is that function
<script type="text/javascript">
$(document).ready(function(){
$("#myController").jFlow({
slides: "#slides",
controller: ".jFlowControl", // must be class, use . sign
slideWrapper : "#jFlowSlide", // must be id, use # sign
selectedWrapper: "jFlowSelected", // just pure text, no sign
auto: true, //auto change slide, default true
width: "706px",
height: "420px",
duration: 500,
prev: ".jFlowPrev", // must be class, use . sign
next: ".jFlowNext" // must be class, use . sign
});
});
</script>

What i want to do is detect the browser window (max width 1024 ) and change the width and height attribute of this function...something like this :

<SCRIPT language="JavaScript">
<!--
if ((screen.width<=1024) && (screen.height<=768))
{
$(document).ready(function(){
$("#myController").jFlow({
slides: "#slides",
controller: ".jFlowControl", // must be class, use . sign
slideWrapper : "#jFlowSlide", // must be id, use # sign
selectedWrapper: "jFlowSelected", // just pure text, no sign
auto: true, //auto change slide, default true
width: "706px",
height: "420px",
duration: 500,
prev: ".jFlowPrev", // must be class, use . sign
next: ".jFlowNext" // must be class, use . sign
});
});
}
else
{
$(document).ready(function(){
$("#myController").jFlow({
slides: "#slides",
controller: ".jFlowControl", // must be class, use . sign
slideWrapper : "#jFlowSlide", // must be id, use # sign
selectedWrapper: "jFlowSelected", // just pure text, no sign
auto: true, //auto change slide, default true
width: "706px",
height: "420px",
duration: 500,
prev: ".jFlowPrev", // must be class, use . sign
next: ".jFlowNext" // must be class, use . sign
});
});
}
//-->
</SCRIPT>


But can't get this to work:confused:...any help please??

//Sam

Please find this modification useful Sam:

$(document).ready(function(){
isSmall = ((screen.width<=1024) && (screen.height<=768));
$("#myController").jFlow({
slides: "#slides",
controller: ".jFlowControl", // must be class, use . sign
slideWrapper : "#jFlowSlide", // must be id, use # sign
selectedWrapper: "jFlowSelected", // just pure text, no sign
auto: true, //auto change slide, default true
width: (isSmall?"706px":"1024px"),
height: (isSmall?"420px":"768px"),
duration: 500,
prev: ".jFlowPrev", // must be class, use . sign
next: ".jFlowNext" // must be class, use . sign
});
});


If the condition inside isSmall becomes true (meaning the browser's width is 1024px and below, and the height is 768 and lower), the value right after that question-mark is used, otherwise, the value after the colon will be used.


Hope that helps.