jQuery detect apple device css conditional -
i'm attempting detect whether user viewing website apple device, , if are, make div "carriage-promo" behave in way.
ordinarily div has transitions , animate take height 0px 40px when user scrolls down page, doesn't function on touch devices static.
consider:
$(document).ready(function(){ var isiphone = navigator.useragent.tolowercase().indexof("iphone"); var isipad = navigator.useragent.tolowercase().indexof("ipad"); var isipod = navigator.useragent.tolowercase().indexof("ipod"); if(isiphone > -1) { $('#carriage-promo').css({'position':'fixed','bottom':'40px','width':'100%'}); } if(isipad > -1) { $('#carriage-promo').css({'position':'fixed','bottom':'40px','width':'100%'}); } if(isipod > -1) { $('#carriage-promo').css({'position':'fixed','bottom':'40px','width':'100%'}); } });
i've ever used css3 media queries conditional styling behavior in past, occasion calls jquery/js.
any suggestions? i'm expecting either tiny syntax error, or have misunderstood how works!
try add line on ready:
window.scrollby(0, 1);
looks helps on ios > 5
way use position: absolute , set bottom position scrolltop + windowheight - promoheight
Comments
Post a Comment