2 действия jQuery для одного LI, проблема с возвратом false - PullRequest
1 голос
/ 29 декабря 2010

Привет, у меня есть 2 функции для одного меню, нижняя часть слайда под меню и динамическая загрузка содержимого в div. У меня есть 2 JS-файла. Проблема в том, что нижняя часть слайда находится под меню, в любое время для этой же позиции (первая ссылка) я меняю или удаляю «вернуть ложь в первом JS», нижняя часть - это остановка при изменении ссылки (это хороший эффект). Как я могу объединить эти коды для хороших эффектов?

ОДИН ДЛЯ СЛАДКОГО ДНА

(function($) { $.fn.lavaLamp = function(o) { 

o = $.extend({ fx: "linear", speed: 500, click: function(){} }, o || {});

return this.each(function() {
    var me = $(this), noop = function(){},
        $back = $('<li class="back"><div class="left"></div></li>').appendTo(me),
        $li = $("li", this), curr = $("li.current", this)[0] || $($li[0]).addClass("current")[0];

    $li.not(".back").hover(function() {
        move(this);
    }, noop);

    $(this).hover(noop, function() {
        move(curr);
    });

    $li.click(function(e) {
        setCurr(this);
        return o.click.apply(this, [e, this]);
    });

    setCurr(curr);

    function setCurr(el) {
        $back.css({ "left": el.offsetLeft+"px", "width": el.offsetWidth+"px" });
        curr = el;
    };

    function move(el) {
        $back.each(function() {
            $(this).dequeue(); }
        ).animate({
            width: el.offsetWidth,
            left: el.offsetLeft
        }, o.speed, o.fx);
    };

});
};
})(jQuery);

И ВТОРОЙ ДЛЯ НАГРУЗКИ В DIV

$(document).ready(function() {

 var hash = window.location.hash.substr(1);
 var href = $('#nav li a').each(function(){
  var href = $(this).attr('href');
  if(hash==href.substr(0,href.length-5)){
   var toLoad = hash+'.html #content';
   $('#content').load(toLoad)
  }           
 });

 $('#nav li a').click(function(){

  var toLoad = $(this).attr('href')+' #content';
  $('#content').hide('fast',loadContent);
  $('#load').remove();
  $('#contents').append('<span id="load">LOADING...</span>');
  $('#load').fadeIn('normal');
  window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
  function loadContent() {
   $('#content').load(toLoad,'',showNewContent())
  }
  function showNewContent() {
   $('#content').show('normal',hideLoader());
  }
  function hideLoader() {
   $('#load').fadeOut('normal');
  }
  return false;

 });

});

1 Ответ

2 голосов
/ 30 декабря 2010

Вместо return false, чтобы предотвратить переход на href, используйте event.preventDefault(), который делает только , что не убивает событие, например:

$('#nav li a').click(function(e){ //add event parameter here
  var toLoad = $(this).attr('href')+' #content';
  $('#content').hide('fast',loadContent);
  $('#load').remove();
  $('#contents').append('<span id="load">LOADING...</span>');
  $('#load').fadeIn('normal');
  window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
  function loadContent() {
    $('#content').load(toLoad,'',showNewContent())
  }
  function showNewContent() {
    $('#content').show('normal',hideLoader());
  }
  function hideLoader() {
    $('#load').fadeOut('normal');
  }
  e.preventDefault();
});
...