I have this site and I try to add a contact form in jQuery called facebox, and when I add this code for the contact form work with style the slider and style in menu doesn't work correctly:
<script type="text/javascript" src="formulario/jquery.js"></script>
How can I resolve this so the contact form would work fine?
Problem explanation:
Code of the site:
<script src="javascripts/home_packaged.js" type="text/javascript"></script>
<link href="stylesheets/home_packaged.css" media="screen" rel="stylesheet" type="text/css" />
<!-- THIS IS MY ORIGINAL LIBRARIES JQUERY CODE -->
<script type="text/javascript" src="javascripts/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="javascripts/jquery.min.js"></script>
<script type="text/javascript" src="javascripts/jquery.selectbox-0.5.js"></script>
<script type="text/javascript" src="javascripts/jquery.colorbox.js"></script>
<!-- DDSlider jQuery Plugin - VERY IMPORTANT -->
<script type="text/javascript" src="javascripts/jquery.DDSlider.min.js"></script>
<!-- Let's start the slider -->
<script type="text/javascript">
//triggers the slider
$(document).ready(function() {
$('#Items1').selectbox();
$('#Items2').selectbox();
$('#Items3').selectbox();
$('#Items4').selectbox();
$('#Items5').selectbox();
$('#Items6').selectbox();
$('#Items7').selectbox();
$('#Items8').selectbox();
$('#Items9').selectbox();
$('#Items10').selectbox();
$(".example5").colorbox();
$('#yourSliderId').DDSlider({
nextSlide: '.slider_arrow_right',
prevSlide: '.slider_arrow_left',
selector: '.slider_selector'
});
});
</script>
<script type="text/javascript">$(document).ready(function(){jQuery.ajaxSetup({'beforeSend':function(xhr){xhr.setRequestHeader("Accept","text/javascript")}})
$("#q").autocomplete({url:'/categories.js',mustMatch:false});$("#q").autocomplete('/categories',function(event,data,formatted){if(data)
document.location.href='/categories/'+data[1];});});</script>
<script type="text/javascript">$(document).ready(function(){$('img.menu_class').click(function(){$('ul.the_menu2').hide();$('ul.the_menu3').hide();$('ul.the_menu').slideToggle('medium');});});$(document).ready(function(){$('a.menu_class').click(function(){$('ul.the_menu2').hide();$('ul.the_menu3').hide();$('ul.the_menu').slideToggle('medium');});});$(document).ready(function(){$('img.menu_class2').click(function(){$('ul.the_menu').hide();$('ul.the_menu3').hide();$('ul.the_menu2').slideToggle('medium');});});$(document).ready(function(){$('img.menu_class3').click(function(){$('ul.the_menu').hide();$('ul.the_menu2').hide();$('ul.the_menu3').slideToggle('medium');});});</script>
<script type="text/javascript">(function($){$.fn.extend({customStyle:function(options){if(!$.browser.ms开发者_开发百科ie||($.browser.msie&&$.browser.version>6)){return this.each(function(){var currentSelected=$(this).find(':selected');$(this).after('<span class="customStyleSelectBox"><span class="customStyleSelectBoxInner">'+currentSelected.text()+'</span></span>').css({position:'absolute',opacity:0,fontSize:$(this).next().css('font-size')});var selectBoxSpan=$(this).next();var selectBoxWidth=parseInt($(this).width())-parseInt(selectBoxSpan.css('padding-left'))-parseInt(selectBoxSpan.css('padding-right'));var selectBoxSpanInner=selectBoxSpan.find(':first-child');selectBoxSpan.css({display:'inline-block'});selectBoxSpanInner.css({width:selectBoxWidth,display:'inline-block'});var selectBoxHeight=parseInt(selectBoxSpan.height())+parseInt(selectBoxSpan.css('padding-top'))+parseInt(selectBoxSpan.css('padding-bottom'));$(this).height(selectBoxHeight).change(function(){selectBoxSpanInner.text($(this).find(':selected').text()).parent().addClass('changed');});});}}});})(jQuery);$(function(){$('select.styled').customStyle();});</script>
<script type="text/javascript">jQuery(document).ready(function(){jQuery('#mycarousel').jcarousel();});</script>
<script type="text/javascript">$(document).ready(function(){$('#slider1').s3Slider({timeOut:4000});});</script>
<script type="text/javascript">$(document).ready(function()
{$(".tab_content-n").hide();$("ul.tabs-n li:first").addClass("active").show();$(".tab_content-n:first").show();$("ul.tabs-n li").click(function()
{$("ul.tabs-n li").removeClass("active");$(this).addClass("active");$(".tab_content-n").hide();var activeTab=$(this).find("a").attr("href");$(activeTab).fadeIn();return false;});});</script>
<!-- then I ADD THIS CODE FOR ADD A CONTACT FORM AND THE ERRORS BEGIN -->
<script type="text/javascript" src="formulario/jquery.js"></script>
<script type="text/javascript" src="formulario/jquery.form.js"></script>
<script src="formulario/facebox/facebox.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".contimage").hover(function() {
$(this).animate({
opacity:1
},200);
}, function() {
$(this).animate({
opacity:0.8
},200);
});
$('#submitform').ajaxForm({
target: '#error',
success: function() {
$('#error').fadeIn('slow');
}
});
$('a[rel*=facebox]').facebox()
});
</script>
Also available here: http://pastebin.com/vQrSx0GU
It looks like your jquery code is not added until much after your jQuery plugins are loaded. This:
<script type="text/javascript" src="formulario/jquery.js"></script>
Should come before
<script type="text/javascript" src="javascripts/jquery.DDSlider.min.js"></script>
Also, I would suggest adding a class to each of selectbox elements, maybe "selectBoxItems" and then operate on the class.
$('#Items1').selectbox();
$('#Items2').selectbox();
$('#Items3').selectbox();
$('#Items4').selectbox();
$('#Items5').selectbox();
$('#Items6').selectbox();
$('#Items7').selectbox();
$('#Items8').selectbox();
$('#Items9').selectbox();
$('#Items10').selectbox();
$(".example5").colorbox();
$('#yourSliderId').DDSlider({
nextSlide: '.slider_arrow_right',
prevSlide: '.slider_arrow_left',
selector: '.slider_selector'
});
});
This would be changed to
$(".selectBoxItems").selectbox();
$('#yourSliderId').DDSlider({
nextSlide: '.slider_arrow_right',
prevSlide: '.slider_arrow_left',
selector: '.slider_selector'
});
Could you post the code specific to the problem, both HTML and JS here (preferably formatted)?
精彩评论