1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

XF 1.4 Javascript ignored for Responsive

Discussion in 'Styling and Customization Questions' started by RoyalRumble, Nov 25, 2014.

  1. RoyalRumble

    RoyalRumble Active Member

    Hi,

    I'm inserting a snippet of javascript in my 'page_container_js_body' that allows for Christmas effect (snow, image overlays etc) on my forum theme.

    However, I'm not wanting this script to be loaded on responsive/mobile.

    Is there a way I can do this? If so, instruction would be most welcome.

    Thanks
     
  2. EQnoble

    EQnoble Well-Known Member

    Wrap your js with something like this, this is what you need in one of the most basic forms.
    Code:
    if( $(window).width()>800){
       YOUR.SCRIPT.HERE
    }
     
  3. RoyalRumble

    RoyalRumble Active Member

    Thanks very much for trying to help - unfortunately this didn't work.
     
  4. EQnoble

    EQnoble Well-Known Member

    I have a few minutes now if you want to link me to your board and give me access to get that working for you.
     
  5. RoyalRumble

    RoyalRumble Active Member

    Thanks a lot!

    I can't give you access but it's very easy to replicate. The code I'm inserting in page_container_js_body is below. I'm wanting the effects to appear on desktop, but not responsive.

    Code:
      <script type='text/javascript'>
    //<![CDATA[
    document.write('<style type="text/css">body{padding-bottom:150px}</style><img style="position:fixed;z-index:9999;top:0;left:0" src="https://lh6.googleusercontent.com/-c8CoUvCourw/UMcWWTeBE-I/AAAAAAAABcU/q-j9X7733zw/s150/top-left.png"/><img style="position:fixed;z-index:9999;top:0;right:0" src="https://lh5.googleusercontent.com/-JABklf9ModU/UMcWWzSSJ4I/AAAAAAAABcY/g4sZMhrgjXU/s150/top-right.png"/><div style="position:fixed;z-index:9999;bottom:0;left:0;width:100%;height:104px;background:url(https://lh6.googleusercontent.com/-kph53UsoxM4/UMczVhTsCVI/AAAAAAAABcs/DVTyvtz7blc/s1600/footer.png) repeat-x bottom left;"></div><img style="position:fixed;z-index:9999;bottom:30px;left:30px" src="https://lh4.googleusercontent.com/-mEgGUg-ou4k/UMcz0qy2NhI/AAAAAAAABc0/gF1uW4iE6y0/s180/bottom-left.png"/>');var no=100;var hidesnowtime=0;var snowdistance='pageheight';var ie4up=(document.all)?1:0;var ns6up=(document.getElementById&&!document.all)?1:0;function iecompattest(){return(document.compatMode&&document.compatMode!='BackCompat')?document.documentElement:document.body}var dx,xp,yp;var am,stx,sty;var i,doc_width=800,doc_height=600;if(ns6up){doc_width=self.innerWidth;doc_height=self.innerHeight}else if(ie4up){doc_width=iecompattest().clientWidth;doc_height=iecompattest().clientHeight}dx=new Array();xp=new Array();yp=new Array();am=new Array();stx=new Array();sty=new Array();for(i=0;i<no;++i){dx[i]=0;xp[i]=Math.random()*(doc_width-50);yp[i]=Math.random()*doc_height;am[i]=Math.random()*20;stx[i]=0.02+Math.random()/10; sty[i]=0.7+Math.random();if(ie4up||ns6up){document.write('<div id="dot'+i+'" style="POSITION:absolute;Z-INDEX:'+i+';VISIBILITY:visible;TOP:15px;LEFT:15px;"><span style="font-size:18px;color:#fff">*</span><\/div>')}}function snowIE_NS6(){doc_width=ns6up?window.innerWidth-10:iecompattest().clientWidth-10;doc_height=(window.innerHeight&&snowdistance=='windowheight')?window.innerHeight:(ie4up&&snowdistance=='windowheight')?iecompattest().clientHeight:(ie4up&&!window.opera&&snowdistance=='pageheight')?iecompattest().scrollHeight:iecompattest().offsetHeight;for(i=0;i<no;++i){yp[i]+=sty[i];if(yp[i]>doc_height-50){xp[i]=Math.random()*(doc_width-am[i]-30);yp[i]=0;stx[i]=0.02+Math.random()/10;sty[i]=0.7+Math.random()}dx[i]+=stx[i];document.getElementById('dot'+i).style.top=yp[i]+'px';document.getElementById('dot'+i).style.left=xp[i]+am[i]*Math.sin(dx[i])+'px'}snowtimer=setTimeout('snowIE_NS6()',10)}function hidesnow(){if(window.snowtimer){clearTimeout(snowtimer)}for(i=0;i<no;i++)document.getElementById('dot'+i).style.visibility='hidden'}if(ie4up||ns6up){snowIE_NS6();if(hidesnowtime>0)setTimeout('hidesnow()',hidesnowtime*1000)}
    //]]>
    </script>
    
     
  6. EQnoble

    EQnoble Well-Known Member

    To be honest, after looking at the script and the way it is written, I just see problems waiting to happen that aren't worth working around for a seasonal animated js pluggin. If I needed a script which did the same as that one I would probably just write my own before I pasted that anywhere on my server. If someone else wants to help you with this I applaud them.
     
  7. RoyalRumble

    RoyalRumble Active Member

    Ah I see.

    It's a resource published on this very forum...

    It works perfect for what I need it for, it's just too busy on responsive.
     

Share This Page