4 Replies Latest reply on Mar 24, 2012 1:09 PM by mhollis55

    Help finding controlling css or js code

    Rob2Smith Level 1


      I am using a template here: http://newbuild.usprayercenter.org/


      Can someone help me find what css or js controls the boxes/buttons in the slider area? I want to make them STOP going white as the slider changes.

      Thanks in advance!


        • 1. Re: Help finding controlling css or js code
          adninjastrator Level 4

          Where exactly is the "slider area"?


          • 2. Re: Help finding controlling css or js code
            Rob2Smith Level 1

            The rotating picture, below the menu. It is pretty slow at this point. Three buttons sit on top of it, on the right. The first says "Donate"

            • 3. Re: Help finding controlling css or js code
              adninjastrator Level 4

              Well without downloading and inspecting each file, why don't you try "turning off" each of the .js files, one at a time by appending this to the end of the file name "_off". Then that file will not be found... so it will have no effect on the page. For example:

              <script src="js/superfish.js" type="text/javascript"></script>

              change it to

              <script src="js/superfish_off.js" type="text/javascript"></script>

              then test the page... easy enough to turn back on.

              Once you find which .js file is the one, open it up and take a look.


              • 4. Re: Help finding controlling css or js code
                mhollis55 Level 4

                OK, your "slider boxes" are defined in CSS.


                If you look in style.css under  /*****************slider***************/

                you will see pretty much everything.


                You have .png files for each of the boxes and you change them with JavaScript. But if you simply set the color you want and take away the pertinent Javascript file, you'll be all set—though you do have mouseover and hover states defined as well that you could either get rid of in CSS or comment out or, perhaps, change to suit what you are trying to do.


                At first, I didn't notice what you were talking about then I REALLY noticed it. It is absolutely annoying to have a jQuery slide show at the same time as another change of state for a series of buttons sitting right on top of it. That's just bad design! So I completely agree with you in that you want to get rid of it.


                I'm also going to hazard a guess that it's jqueryhoverIntent.js that is the offending file. The rest are for your navigation and other stuff.


                Here's another point.


                You have:


                background:url(../images/loading.gif) center center no-repeat;


                Set for your slider. Don't do that. Instead, make your image background your first image thusly:


                background:url(../images/slider-img3.jpg) center center no-repeat;


                That way, your first image is there all ready on page load. You don't need some indication that something is loading. That is SO 1990s. Everyone wants to see your website blast onto the screen. Either that, or you're trying to fake people out into thinking you're using Flash (which is what I thought).


                Finally, you're using a crappy host. Get off GoDaddy. They have really slow servers.