CODEWITHSUNDEEP
javascriptjqueryjquery-uijquery-mobilejquery-events
user2045025
user2045025

Reputation:

jQuery resize function for media queries

I added the re-size function because when I use the media queries the cube was not showing up.... when I resize the browser to the size of iPhone screen the iPhone image will appear only if refresh the page.... but each time when I resize the window its continuously refreshing..... is it anyway possible to refresh the browser window only for iPhone screens.... like specifying the width in js....

Providing my code below....

http://jsfiddle.net/sDXTx/1/

<script type="text/javascript">



$(window).bind('resize', function() { location.reload();

     Gallery.setOptions({
            size: 78,
            lightbox: false,
            //animation:  'drop'
            //speed:      500,
            //closeOnEsc: true,
            //slideshow:  false,
            //slideshow_speed: 3000,
            //cube_speed: 1000
        });

 })

Upvotes: 2

Views: 174

Answers (1)

Stef
Stef

Reputation: 29

This should do the trick:

if ((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) {
    $(window).bind('resize', function () {
        location.reload();
        Gallery.setOptions({
            size: 78,
            lightbox: false
            //animation:  'drop'
            //speed:      500,
            //closeOnEsc: true,
            //slideshow:  false,
            //slideshow_speed: 3000,
            //cube_speed: 1000
        });

    })
}

Also, be sure to remove the last comma in your parameters or IE will throw an error!

Upvotes: 2

Related Questions