views:

113

answers:

2

I am having strange problem, whenever my site is loaded for the first time in the browser, its jquery and slider doesnt work at all........ then when i refersh the page it loads it properly.... I am using Firefox latest 3.6.8 version CSS is loaded before jquery and slider scripts

here is the link for website link text

I fixed the button positioning with 2 solutions

  1. One was to use % in positioning like left:90%
  2. Other i found by checking the original easy slider 1.5 css file which was to use a container to display all the content within and container will have same width as the images in the slider..... hope it helps others
+1  A: 

Make sure to wrap JQuerys

$(document).ready(function() {
}

function arround your slider code.

Sounds to me like your code is only loading fast enough, when its cached after the first page load.

JochenJung
+4  A: 

I had no difficulty viewing your site in Firefox version '3.6.8' without a refresh? The slider appears to function correctly, however, with fresh eyes I did notice some things in the page source that you might wish to check, especially point 1.:

  1. [EDIT] The JavaScript block within the 'Head' tag is missing closing semicolons (';') at the end of the first four 'var' lines:

    <script type="text/javascript">
        var browser = navigator.appName
        var ver = navigator.appVersion
        var thestart = parseFloat(ver.indexOf("MSIE"))+1
        var brow_ver = parseFloat(ver.substring(thestart+4,thestart+7))
        if ((browser=="Microsoft Internet Explorer") && (brow_ver < 7))
        {
            alert("Please Update your OLD BROWSER ,Please install Google chrome or Firefox to view the site propertly");
            window.location="http://www.mozilla.com/en-US/products/download.html";
        }
    </script>
    

    [EDIT] Also, it's advisable to include JavaScript in 'CDATA' or 'Character Data' sections:

    <script type="text/javascript">
    //<![CDATA[
        // Your Javascript goes here...
    //]]>
    </script>
    

    More info: here and here.

    [EDIT] Finally, notice the variable 'brow_ver' is declared in the script, but on the following line a variable 'browser' is referenced?

  2. The ‘&amp;’ character entity reference should be used instead of ‘&’ in the ‘title’ tag

  3. One of the 'Meta Tags' is missing a closing '/'.

  4. [EDIT] The conditional comment '<![if !(IE 6)]>' should be '<!--[if !(IE 6)]>' and '<![endif]>' should be '<![endif]>-->'

  5. [EDIT] The UTF-8 encoding includes and encompasses all of US-ASCII characters, so in the meta tag consider using the following 'Content Encoding':

    content="text/html; charset=UTF-8" instead of content="text/html; charset=us-ascii"

  6. Also FYI: the '-' and '+' navigation buttons for the slider are not positioning correctly. Please see image reference below. This might not be apparent on your screen... try a higher resolution with the browser set to full screen to replicate it.

    [EDIT] Just for others reading this... I notice you have fixed the '-' / '+' navigation positioning by using '%' instead of 'px' in the CSS. So for example:

    #nextBtn{
        display:block;
        width:36px;
        height:36px;
        position:absolute;
        left:90%;  /* <<< Will position correctly */
        top:365px;
        z-index:1000;
    }
    

    instead of...

    #nextBtn{
        display:block;
        width:36px;
        height:36px;
        position:absolute;
        left:1025px;  /* <<< Won't position correctly */
        top:365px;
        z-index:1000;
    }
    

The same goes for the 'Previous' nav button.

Site Screenshot of incorrect navigation buttons positioning

The best of luck with the site... it looks good! :)

Anthony Walsh
You have pointed out a lot of good errors, but can you tell me that what should i do to position those plus and minus signs..........they are positioned with absolute and i am using em in their left values like left:78.5em
Muhammad Ahsan
Muhammad, I have just added a few edits above that you might wish to check-out. I notice you sorted the positioning problem - well done. Don't forget to fix that JavaScrpt too, as it might cause issues in some browsers. Best of luck.
Anthony Walsh