2012-11-09 64 views
2

我有一个meta规则添加到我的网站,所以ipad缩放一切,我只希望这发生在横向模式,当用户改变方向为肖像或如果用户在纵向模式下加载页面我想要的比例更改为1,并将整个页面缩放以适合。我可以为iPad指定纵向和横向的初始视图比例吗?

我已经使用这段代码。

if(ipad){ 
      window.onorientationchange = function() { 

       var orientation = window.orientation; 
       var location = window.location.href; 
       gallery.rescale(); 
       if (orientation === 0) { 
        $('.galleria-thumbnails .galleria-image:nth-child(5n+5)').removeClass('last-thumb'); 
        $('.galleria-thumbnails .galleria-image:nth-child(4n+4)').addClass('last-thumb'); 
        $('.galleria-thumbnails .galleria-image:nth-child(4n+1)').addClass('next-thumb'); 
        $('.galleria-thumbnails .galleria-image:nth-child(1)').removeClass('next-thumb'); 



        $("body").addClass("portrait"); 

       } else if (orientation === 90) { 
        $('.galleria-thumbnails .galleria-image:nth-child(5n+5)').addClass('last-thumb'); 
        $('.galleria-thumbnails .galleria-image:nth-child(4n+4)').removeClass('last-thumb') 
        $('.galleria-thumbnails .galleria-image:nth-child(4n+1)').removeClass('next-thumb'); 

        $("body").removeClass("portrait");      

       } else if (orientation === -90) { 
        $('.galleria-thumbnails .galleria-image:nth-child(5n+5)').addClass('last-thumb'); 
        $('.galleria-thumbnails .galleria-image:nth-child(4n+4)').removeClass('last-thumb') 
        $('.galleria-thumbnails .galleria-image:nth-child(4n+1)').removeClass('next-thumb'); 

        $("body").removeClass("portrait"); 


       } else if (orientation === 180) { 
        $('.galleria-thumbnails .galleria-image:nth-child(5n+5)').removeClass('last-thumb'); 
        $('.galleria-thumbnails .galleria-image:nth-child(4n+4)').addClass('last-thumb'); 
        $('.galleria-thumbnails .galleria-image:nth-child(4n+1)').addClass('next-thumb'); 
        $('.galleria-thumbnails .galleria-image:nth-child(1)').removeClass('next-thumb'); 

        $("body").addClass("portrait"); 

       } 
      }  
     } 

这使得缩略图每排纵向和横向之间切换,而且运作良好。

我试图在每个方向更改规则上添加<meta name="viewport" content="width=device-width, initial-scale=0.85" />,但它不起作用。

任何想法为什么? 我很想解决这个问题或知道是否有一个。

非常感谢您的帮助

+0

我已经想通了,我需要添加/删除画像时,页面加载,否则取向不正确重新调整。 –

+0

您应该将您的评论置于“答案”中,并将其标记为您的问题的答案。 :) – teewuane

回答

0

我已经想通了,我需要添加/删除画像时,页面加载,否则取向不正确重新调整。

***感谢teewuane

相关问题