Прежде всего, я хотел бы извиниться, если этот вопрос, который у меня есть, был разрешен уже пятьдесят пять миллионов раз. К сожалению, я не нашел ответа здесь. Кроме того, я очень зеленый путь к jQuery, так что простите мое невежество по этому вопросу.Новичок, имеющий проблемы с конфликтом jQuery
Я использую jQuery для 3-х областей (не уверен, какой термин использовать) - прокрутка к функции, галерея fancybox и кнопка «назад к началу». Любые двое из них прекрасно работают вместе, когда я пытаюсь реализовать все три, я теряю fancybox.
Вот код из головы:
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<link href="js/fancybox/jquery.fancybox.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript" src="js/fancybox/jquery.fancybox.pack.js"></script>
<script type="text/javascript">
$(function() {
function filterPath(string) {
return string
.replace(/^\//,'')
.replace(/(index|default).[a-zA-Z]{3,4}$/,'')
.replace(/\/$/,'');
}
var locationPath = filterPath(location.pathname);
var scrollElem = scrollableElement('html', 'body');
// Any links with hash tags in them (can't do ^= because of fully qualified URL potential)
$('a[href*=#]').each(function() {
// Ensure it's a same-page link
var thisPath = filterPath(this.pathname) || locationPath;
if (locationPath == thisPath
&& (location.hostname == this.hostname || !this.hostname)
&& this.hash.replace(/#/,'')) {
// Ensure target exists
var $target = $(this.hash), target = this.hash;
if (target) {
// Find location of target
var targetOffset = $target.offset().top;
$(this).click(function(event) {
// Prevent jump-down
event.preventDefault();
// Animate to target
$(scrollElem).animate({scrollTop: targetOffset}, 900, function() {
// Set hash in URL after animation successful
location.hash = target;
});
});
}
}
});
// Use the first element that is "scrollable" (cross-browser fix?)
function scrollableElement(els) {
for (var i = 0, argLength = arguments.length; i <argLength; i++) {
var el = arguments[i],
$scrollElement = $(el);
if ($scrollElement.scrollTop()> 0) {
return el;
} else {
$scrollElement.scrollTop(1);
var isScrollable = $scrollElement.scrollTop()> 0;
$scrollElement.scrollTop(0);
if (isScrollable) {
return el;
}
}
}
return [];
}
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$(window).scroll(function(){
if ($(this).scrollTop() > 100) {
$('.scrollup').fadeIn();
} else {
$('.scrollup').fadeOut();
}
});
$('.scrollup').click(function(){
$("html, body").animate({ scrollTop: 0 }, 600);
return false;
});
});
</script>
и снизу тела тега:
<script type="text/javascript">
$(document).ready(function(){
$(".fancybox").fancybox();
});
</script>
<script type="text/javascript">
$(".fancybox").fancybox({
nextEffect : 'fade',
prevEffect : 'fade',
padding : 0,
margin : [15, 15, 40, 15],
afterLoad : addLinks,
beforeClose : removeLinks
});
function addLinks() {
var list = $("#links");
if (!list.length) {
list = $('<ul id="links">');
for (var i = 0; i < this.group.length; i++) {
$('<li data-index="' + i + '"><label></label></li>').click(function() {
$.fancybox.jumpto($(this).data('index'));}).appendTo(list);
}
list.appendTo('body');
}
list.find('li').removeClass('active').eq(this.index).addClass('active');
}
function removeLinks() {
$("#links").remove();
}
</script>
Вы получаете какие-либо ошибки в консоли? – SLaks
Вы пробовали jQuery.noConflict()? –
Когда вы публикуете вопросы с этим много кода, обычно считается хорошей формой для отступов/кодирования, чтобы было легко читать .... –