I have problem, please help me! 2 scripts does not working together for some reason, i'll exaplain. I have menu and rating with javascript (Menu of downloads & Share & details- see picture). I try to find the good place to put each code that both will work, but i dont know how.. Picture 1: Menu is not working here the code: <head> <title>{image_name} High Definition Wallpaper, HD Wallpaper</title> <META NAME="Description" CONTENT="{image_name} High Definition Wallpaper, click now and find more High Definition Wallpapers of {image_name} and much more"> <base href="http://www.backgroundscity.net"> <link rel="shortcut icon" href="{template_url}/images/icon1.ico"> <script src="/stats/?js" type="text/javascript"></script> <meta http-equiv="content-type" content="text/html; charset={charset}" /> <script src="http://cdn.gigya.com/wildfire/js/wfapiv2.js"></script> <script type="text/javascript"> function highlight(field) { field.focus(); field.select(); } </script> <link type="text/css" href="{template_url}/css/flick/jquery-ui-1.7.2.custom.css" rel="stylesheet" /> <script type="text/javascript" src="{template_url}/js/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="{template_url}/js/jquery-ui-1.7.2.custom.min.js"></script> <script type="text/javascript"> $(function(){ // Tabs $('#tabs').tabs(); //hover states on the static widgets $('#dialog_link, ul#icons li').hover( function() { $(this).addClass('ui-state-hover'); }, function() { $(this).removeClass('ui-state-hover'); } ); }); </script> <style type="text/css"> /*demo page css*/ body{ font: 62.5% "Trebuchet MS", sans-serif; margin: 50px;} .demoHeaders { margin-top: 2em; } #dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;} #dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;} ul#icons {margin: 0; padding: 0;} ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left; list-style: none;} ul#icons span.ui-icon {float: left; margin: 0 4px;} </style> <link rel="stylesheet" href="{template_url}/style.css" /> <!-- ----------------------------------------------- --> <!-- [MOD] Ajax Star Rating -------------- by Bash-T --> <!-- START ----------------------------------------- --> <script type="text/javascript" src="scripts/yui/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"></script> <script type="text/javascript" src="scripts/yui/2.7.0/build/json/json-min.js"></script> <script type="text/javascript" src="scripts/yui/2.7.0/build/connection/connection-min.js"></script> <!-- ----------------------------------------------- --> <!-- [MOD] Ajax Star Rating -------------- by Bash-T --> <!-- END ----------------------------------------- --> <!----------------------------------------------------- //--- [MOD] Ajax Star Rating --------------by Bash-T--- //START-----------------------------------------------> <script type="text/javascript"> YAHOO.namespace('rating'); YAHOO.rating.star={ display_percentage : false, //set to true if a percentaged value shall be shown beneath the stars. display_lables: true, //set to true if a ranking label shall be displayed beneath the stars at mouseover. //do not modify the properties below! num : {image_id}, successfully_voted : false, labels : [ '{ajax_rating_labels_0}' , '{ajax_rating_labels_1}', '{ajax_rating_labels_2}', '{ajax_rating_labels_3}', '{ajax_rating_labels_4}', '{ajax_rating_labels_5}'], msgs : [ '{ajax_rating_messages_0}' , '{ajax_rating_messages_1}', '{ajax_rating_messages_2}'] }; </script> <script type="text/javascript" src="scripts/ajaxrating.js"></script> <!----------------------------------------------------- //--- [MOD] Ajax Star Rating --------------by Bash-T--- //-----------------------------------------------END--> {if has_rss} <link rel="alternate" type="application/rss+xml" title="{rss_title}" href="{rss_url}" /> {endif has_rss} </head> Code (markup): Picture 2: Rating star isnt working (see online: http://www.backgroundscity.net/lions_112/lion-closeup-by-ng-25433.htm) you can see the stars but they arent working! <head> <title>{image_name} High Definition Wallpaper, HD Wallpaper</title> <META NAME="Description" CONTENT="{image_name} High Definition Wallpaper, click now and find more High Definition Wallpapers of {image_name} and much more"> <base href="http://www.backgroundscity.net"> <link rel="shortcut icon" href="{template_url}/images/icon1.ico"> <script src="/stats/?js" type="text/javascript"></script> <meta http-equiv="content-type" content="text/html; charset={charset}" /> <script src="http://cdn.gigya.com/wildfire/js/wfapiv2.js"></script> <script type="text/javascript"> function highlight(field) { field.focus(); field.select(); } </script> <link type="text/css" href="{template_url}/css/flick/jquery-ui-1.7.2.custom.css" rel="stylesheet" /> <!-- ----------------------------------------------- --> <!-- [MOD] Ajax Star Rating -------------- by Bash-T --> <!-- START ----------------------------------------- --> <script type="text/javascript" src="scripts/yui/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js"></script> <script type="text/javascript" src="scripts/yui/2.7.0/build/json/json-min.js"></script> <script type="text/javascript" src="scripts/yui/2.7.0/build/connection/connection-min.js"></script> <!-- ----------------------------------------------- --> <!-- [MOD] Ajax Star Rating -------------- by Bash-T --> <!-- END ----------------------------------------- --> <!----------------------------------------------------- //--- [MOD] Ajax Star Rating --------------by Bash-T--- //START-----------------------------------------------> <script type="text/javascript"> YAHOO.namespace('rating'); YAHOO.rating.star={ display_percentage : false, //set to true if a percentaged value shall be shown beneath the stars. display_lables: true, //set to true if a ranking label shall be displayed beneath the stars at mouseover. //do not modify the properties below! num : {image_id}, successfully_voted : false, labels : [ '{ajax_rating_labels_0}' , '{ajax_rating_labels_1}', '{ajax_rating_labels_2}', '{ajax_rating_labels_3}', '{ajax_rating_labels_4}', '{ajax_rating_labels_5}'], msgs : [ '{ajax_rating_messages_0}' , '{ajax_rating_messages_1}', '{ajax_rating_messages_2}'] }; </script> <script type="text/javascript" src="scripts/ajaxrating.js"></script> <!----------------------------------------------------- //--- [MOD] Ajax Star Rating --------------by Bash-T--- //-----------------------------------------------END--> <script type="text/javascript" src="{template_url}/js/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="{template_url}/js/jquery-ui-1.7.2.custom.min.js"></script> <script type="text/javascript"> $(function(){ // Tabs $('#tabs').tabs(); //hover states on the static widgets $('#dialog_link, ul#icons li').hover( function() { $(this).addClass('ui-state-hover'); }, function() { $(this).removeClass('ui-state-hover'); } ); }); </script> <style type="text/css"> /*demo page css*/ body{ font: 62.5% "Trebuchet MS", sans-serif; margin: 50px;} .demoHeaders { margin-top: 2em; } #dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;} #dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;} ul#icons {margin: 0; padding: 0;} ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left; list-style: none;} ul#icons span.ui-icon {float: left; margin: 0 4px;} </style> <link rel="stylesheet" href="{template_url}/style.css" /> {if has_rss} <link rel="alternate" type="application/rss+xml" title="{rss_title}" href="{rss_url}" /> {endif has_rss} </head> Code (markup): Please, help!?
I can't be sure. Usually when this happens you either have two functions with the same name or two global variables with the same name.
Because they are two different popular JavaScript framework libraries, probably they cause a conflict running together. You can fix it by writing all the scripts on one library, if that really is the problem of course.