Jump to content

View more

Image of the Day

Boxes as reward for our ranking mode. ヾ(☆▽☆)
#indiedev #gamedev #gameart #screenshotsaturday https://t.co/ALF1InmM7K
IOTD | Top Screenshots

The latest, straight to your Inbox.

Subscribe to GameDev.net Direct to receive the latest updates and exclusive content.


Sign up now

Responsive Design Javascript

4: Adsense

Old topic!

Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.


  • You cannot reply to this topic
No replies to this topic

#1 Michael Tanczos   Staff Emeritus   

Posted 14 January 2013 - 11:27 PM

Adding this code to the site starts to make the site more size responsive on lower resolutions.. this is a work in progress:

 

 
</p><div>Event.observe(window, "resize", function() {</div>
<div>    var width = document.viewport.getWidth();</div>
<div>    var height = document.viewport.getHeight();</div>
<div>    var dims = document.viewport.getDimensions(); // dims.width and dims.height</div>
<div> </div>
<div>    if (width < 1024)</div>
<div>    {</div>
<div>$$('.ipsLayout_right').each(Element.hide);</div>
<div>$$('.ipsLayout_withright').invoke('toggleClassName', 'ipsLayout_withright_disabled'); </div>
<div>$$('.ipsLayout_withright').invoke('toggleClassName', 'ipsLayout_withright'); </div>
<div>$$('.ipsLayout_content').invoke('toggleClassName', 'clearfix');</div>
<div>$$('#content,.main_width,#branding,#header_bar,#primary_nav').invoke('setStyle', { 'min-width': '0px' });</div>
<div> </div>
<div>$$('#dark').invoke('setStyle', { 'overflow': 'hidden' });</div>
<div>        if (width < 800)</div>
<div>$('search').hide();</div>
<div> </div>
<div>$('leaderboard').hide();</div>
<div>    }</div>
<div>    else</div>
<div>    {</div>
<div>$$('.ipsLayout_right').each(Element.show);</div>
<div>$$('.ipsLayout_withright_disabled').invoke('toggleClassName', 'ipsLayout_withright'); </div>
<div>$$('.ipsLayout_withright_disabled').invoke('toggleClassName', 'ipsLayout_withright_disabled'); </div>
<div>$$('.ipsLayout_content').invoke('toggleClassName', 'clearfix');</div>
<div>$$('#content,.main_width,#branding,#header_bar,#primary_nav').invoke('writeAttribute', 'style', '');</div>
<div> </div>
<div>$('search').show();</div>
<div>$('leaderboard').show();</div>
<div> </div>
<div>    }</div>
<div>});</div>
<div>
 





Old topic!

Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.