jfade.js and gridlayout.js clashing
Hello.
Ive a problem, im building my folio site and im using gridlayout.js which works great on its own. I also want to use jfade.js (which also works great on its own) - the minute you put both in together either one or the other doesnt work....im presuming its something to do with the $ clashing (perhaps)?
anyway, im placing them in with this:
<script type="text/javascript" src="js/jquery-1.2.6.js"></script>
<script type="text/javascript" src="js/jquery.gridlayout.js"></script>
<script type="text/javascript" src="js/jquery.jfade.1.0.js"></script>
And triggering one with this:
<script language="javascript">
$(document).ready(function() {
$(".block").jFade({
trigger: "mouseout",
property: 'background',
start: 'cccccc',
end: '000000',
steps: 15,
duration: 15
}).jFade({
trigger: "mouseover",
property: 'background',
start: '000000',
end: 'ffffff',
steps: 15,
duration: 15
});
});
</script>
and the other with this:
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('#grid').gridLayout('.block', {col_width: 202, min_cols: 3});
jQuery('#grid').gridLayout.placeAtEnd( final_block );
jQuery('#grid').bind( "gridchange", function(e){
console.log('gridchange event fired');
// reposition the final block
jQuery('#grid').gridLayout.placeAtEnd( final_block );
jQuery('body').gridLayout.refresh();
});
});
</script>
Ive read about the jquery.noconflict thingy but no idea how to implement it (if that is indeed the issue).
Any help would be brilliant, thanks
Mike