Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Javascript conflicting with eachother (stand alone, both work fine)

Featured Replies

Can someone plzzzz help.

 

Why would these snippets of javascript be conflicting, stand alone they work fine)

 

<!-- Js Starts -->
<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script type="text/javascript" src="js/coin-slider.min.js"></script>
<script type="text/javascript" language="javascript" src="js/custom.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	$('#slider').coinslider({
		width: 960, // width of slider panel
		height: 432, // height of slider panel
		spw: 7, // squares per width
		sph: 5, // squares per height
		delay: 5000, // delay between images in ms
		sDelay: 30, // delay beetwen squares in ms
		opacity: 0.7, // opacity of title and navigation
		titleSpeed: 500, // speed of title appereance in ms
		effect: '', // random, swirl, rain, straight
		navigation: true, // prev next and buttons
		links : true, // show images as links
		hoverPause: true // pause on hover
	});
});
</script>

<!-- Js Ends -->

<!-- Js Starts -->

<script type="text/javascript" src="assets/js/sliders.js"></script>
<script type="text/javascript" src="assets/js/custom.js"></script>

<!-- Js Ends -->
</body>
</html>

Edited by Renaissance-Design
Code, not quote

  • Author

What's in sliders.js and the two different custom.js?

 

 

Sliders.js

 /* Nivo Slider */
$(window).load(function() {
   $(".slider").nivoSlider({
    effect:			 'random',
    startSlide:		 0, //Set starting Slide (0 index)
    animSpeed:		  400, //Slide transition speed
    pauseTime:		  3000,
    captionOpacity:	 0.6, //Caption Opacity
    directionNavHide:   true, //Only show on hover
    pauseOnHover:	   false, //Stop animation while hovering
    slices:			 8 // For slice animations
   });
});

/* Coin Slider */
jQuery(document).ready(function() {
   $("#coin-slider").coinslider({
    width: 940,
    height: 350,
    navigation: true,
    effect: '',
    links: false,
    delay: 3000,
    spw: 7, // squares per width
    sph: 7, // squares per height
   });
});

 




js/custom.js

$(function(){

   $("#menu li").hover(function(){

    $(this).addClass("hover");
    $('ul:first',this).css('visibility', 'visible');

   }, function(){

    $(this).removeClass("hover");
    $('ul:first',this).css('visibility', 'hidden');

   });


});

 

assets/js/custom,js

 

/* 1 *** IMAGE ZOOM */
jQuery(document).ready(function() {
   $("a.zoom img").mouseover(function(){
    $(this).stop(true,true);
    $(this).fadeTo(300, 0.6);
   });

   $("a.zoom img").mouseout(function(){
    $(this).fadeTo(400, 1.0);
   });

});



/* 2 *** SHOW MENU SEARCH
$(document).ready(function() {
   $(".menu-search, .search-close").click(function () {
    $("#searchform").toggle("slow");
   });
}); */

$(document).ready(function () {

$('.menu-search, .search-close').click(function () {

    var $search = $('#searchform');

    if ($search.is(':visible')) {

    $search.fadeOut(1000);

    } else {

    $search.fadeIn(1000);

    }

});

});



/* 3 *** PORTFOLIO 4 SLIDING CAPTIONS */
$(document).ready(function() {

   $('.boxgrid.captionfull').hover(function(){
   $(".cover", this).stop().animate({top:'-0px'},{queue:false,duration:200});
   }, function() {
   $(".cover", this).stop().animate({top:'-145px'},{queue:false,duration:700});
   });

});



/* 4 *** JMENU */
jQuery(document).ready(function() {
   $('#menu').jmenu({
    animation:'slide',
    duration:300
   });
});



/* 5 *** PAGE JUMP */
$('.jump').click(function() {
   var elementClicked = $(this).attr("href");
   var destination = $(elementClicked).offset().top;
   $("html:not(:animated),body:not(:animated)").animate({ scrollTop: destination-20}, 1000 );
   return false;
});



/* 6 *** FANCYBOX */
jQuery(document).ready(function() {

   //display image
   $("a.zoom").fancybox();

});



/* 7 *** LATEST TWEETS */
jQuery(window).load(function() {

getTwitters('myTweets', {
    id: 'envato',    // replace with your twitter user id
    prefix: '<a href="http://twitter.com/%...me%">%name%</a> said: ',
    clearContents: false, // leave the original message in place
    count: 2,
    withFriends: true,
    ignoreReplies: false,
 enableLinks: true,
    newwindow: true
   });

});



/* 8 *** TIPSY FOR REPLACING THE "TITLE" ATTRIBUTE VALUES */
jQuery(document).ready(function(){

   $('a.tipsy').tipsy({

    delayIn: 0,	  // delay before showing tooltip (ms)
    delayOut: 0,	 // delay before hiding tooltip (ms)
    fade: true,	 // fade tooltips in/out?
    fallback: '',    // fallback text to use when no tooltip text
    gravity: 's',    // gravity
    html: false,	 // is tooltip content HTML?
    live: false,	 // use live event support?
    offset: 15,	   // pixel offset of tooltip from element
    opacity: 0.8,    // opacity of tooltip
    title: 'title',  // attribute/callback containing tooltip text
    trigger: 'hover' // how tooltip is triggered - hover | focus | manual

   });

});



/* 9 *** JCAROUSEL */
jQuery(document).ready(function() {
   jQuery('.imageCarousel').jcarousel({
    auto: 3,
    scroll: 1,
    wrap: 'last',
    animation: 700,
    initCallback: mycarousel_initCallback,
    buttonNextHTML: null,
    buttonPrevHTML: null
   });
});

function mycarousel_initCallback(carousel) {
   jQuery('.carousel-next').bind('click', function() {
    carousel.next();
    return false;
   });

   jQuery('.carousel-prev').bind('click', function() {
    carousel.prev();
    return false;
   });
};



/* 10 *** Pika Choose */
jQuery(document).ready(function (){
   var a = function(self){
    self.anchor.fancybox();
   };
   $("#pikame").PikaChoose({
    speed: 2500,
    buildFinished:a
   });
});

Edited by Renaissance-Design
Code, not quote

Cn you please upload your code on server?

I am getting the following errors with firebug cosole

 

The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must to be declared in the document or in the transfer protocol.
...conds();wa=na.getUTCMilliseconds();}na=(pa<=0||pa>=10000?(pa<0?"-":"+")+o(6,pa<0...
xd_arb...sion=11 (line 13)
TypeError: $("#menu").jmenu is not a function
[break On This Error] 
...conds();wa=na.getUTCMilliseconds();}na=(pa<=0||pa>=10000?(pa<0?"-":"+")+o(6,pa<0...
xd_arb...sion=11 (line 13)
GET http://static.ak.fbcdn.net/rsrc.php/v2/ys/r/egxQJ5Ow40W.js

200 OK
 169ms
like.p...dth=450 (line 101)
TypeError: $(".slider").nivoSlider is not a function
[break On This Error] 
slices:			 8 // For slice animations

Yes Agree with Elite. There is a markup errors.

 

If you want jQuery fix then remove line number 199, 200, 201 from index page.

 

<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script type="text/javascript" src="js/coin-slider.min.js"></script>
<script type="text/javascript" language="javascript" src="js/custom.js"></script>

 

Your issue will be fix 100% :)

  • Author

Yes Agree with Elite. There is a markup errors.

 

If you want jQuery fix then remove line number 199, 200, 201 from index page.

 

<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script type="text/javascript" src="js/coin-slider.min.js"></script>
<script type="text/javascript" language="javascript" src="js/custom.js"></script>

 

Your issue will be fix 100% :)

 

Thank you so much, works beautifully :)

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.