Hi
I’m a noob with javascript and cant understand how to make this work.
I’m using Media Queries for layout in mobile phones on my webpage and i would like to turn of fancybox and jFlow slider if the screen width is 480px and under.
Here is my Javascript:
$(function() {
$("div#controller").jFlow({
slides: "#slides",
width: "290px",
height: "284px"
});
});
$(document).ready(function() {
$("a[rel=works-group]").fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none',
'titlePosition' : 'inside',
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return 'Work ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' ' + title : '') + '';
}
});
});
I think it sould work with something like this but i cant figure it out how to implement it in code:
if (screen.width > 480) {
slideUp/slideDown/fadeIn/fadeOut
} else {
show/hide
}
Can someone push me in the right direction?