PDA

View Full Version : Total scripting newbi, two scripts clash.



Trihan
05-25-2012, 11:36 PM
Hello, this is also my first post here so I feel a bit rude to start off with a question, but then again my question is what brought me here. I hope anyone could help me out.

This will be a long post since I will describe as much as possible, also good to know is that I am building a website in frontpage (old and rotten as many try to tell me, but I only need it for basic websites for my own and used it for like.. 5 years now or so. So it is easier for me to make it in there.

I am working on a portfolio website which contains just one page, one where the different sections are available when you click on a link.

I got a few scripts on the page which clash.

One is a lightbox, the other is a script which, when you click a link, makes the page slowly ease in and out on the section of the website.
It is this script:
http://tympanus.net/codrops/2010/06/02/smooth-vertical-or-horizontal-page-scrolling-with-jquery/

(not sure how to explain it)
(i use the vertical scrolling one)

This is the script I had to add for the scrolling to work:

-----------------
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript">
$(function() {
$('ul.nav a').bind('click',function(event){
var $anchor = $(this);

$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 1500,'easeInOutExpo');
/*
if you don't want to use the easing effects:
$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 1000);
*/
event.preventDefault();
});
});
</script>
-----------------

When I take out the sentence having http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js in it, my lightbox works again. So I think the problem lays in that javascript.. just, I got no idea how to fix it.

I understood it has to do with a onload function, but since that source is online (and i can paste it in a own javascript file but then it is as..messy and even more complicated to look at) I find it difficult to find a solution for it.

Help would be highly apreciated. I am like.. two steps away from a finished website, just the other step isn't such a big issue, this one is.

Thanks in advance.