Frage

I have a problem with a direction aware hower effect. On a test page is working fine, but when I'm embedding the thumbs into the big site is not working. Please assist! you can check it at http://www.psyhealth.ro/test/index.html. I;ve started from the code posted on : http://tympanus.net/codrops/2012/04/09/direction-aware-hover-effect-with-css3-and-jquery/

here below you can see my actual code:

<link rel="stylesheet" type="text/css" href="css/patratele.css" />
    <script src="js/modernizr.custom.97074.js"></script>
    <noscript><link rel="stylesheet" type="text/css" href="css/noJS.css"/></noscript>
</head>
<body>
                        <ul id="da-thumbs" class="da-thumbs">
                <li>
                    <a href="#">
                        <img src="images/7.jpg" />
                        <div><span>text 1</span></div>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="images/9.jpg" />
                    <div><span>text 2</span></div>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="images/10.jpg" />
                    <div><span>text 3</span></div>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="images/11.jpg" />
                    <div><span>text 4</span></div>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="images/12.jpg" />
                    <div><span>text 5</span></div>
                    </a>
                </li>
                <li>
                    <a href="h#">
                        <img src="images/1.jpg" />
                    <div><span>text 6</span></div>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="images/2.jpg" />
                    <div><span>text 7</span></div>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="images/3.jpg" />
                    <div><span>text 8</span></div>
                    </a>
                </li>

            </ul>

    </div>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.hoverdir.js"></script>    
    <script type="text/javascript">
        $(function() {

            $(' #da-thumbs > li ').each( function() { $(this).hoverdir({
                hoverDelay : 75
            }); } );

        });
    </script>

the same code works perfect in the standalone page, but in the big site it does not work.

War es hilfreich?

Lösung

Try

You are using many version of fancybox and also 2 version of jQuery Library . Use only one version .

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top