不想要页面跳转

时间:2013-03-13 11:29:00

标签: javascript jquery css page-jump

以前的problam在同一个系数上解决了@ use selectors in variable jquery

我必须像this这样的功能 这是使用我不理解的大jquery代码

这是我的jsfiddle  我已经使相同的功能,但当它被点击时,页面跳转到该元素 我不想要页面跳转我需要一些淡出和出来

$(".show").click(function() {
    var link = $('this').attr('href');
  $(link).show();

});

$(".close").click(function() {
  $(this).closest("div.popupbox").hide();
});

和html

<a href="#popup" id="show" class="show">a</a>
<a href="#popup1" id="show1" class="show">b</a>
<a href="#popup2" id="show2" class="show">c</a>

我想在锚定点击时显示#popup但不想跳页/滚动到该ID 我已经给了top:10000px小提琴来测试这个问题,因为在我的原始页面中它移动到特定元素

fiddle上的完整代码,我希望this functionality

4 个答案:

答案 0 :(得分:3)

试试这个:

$(".show").click(function(e) {
  e.preventDefault();
  var link = $(this).attr('href'); //<----remove quotes in $('this')
  $(link).fadeIn(); // <-------------use fadeIn() instead
});

$(".close").click(function(e) {
  e.preventDefault();
  $(this).closest("div.popupbox").hide();
});

并将top:100000px调整为较小的50px

答案 1 :(得分:1)

使用preventDefault()

$(".show").click(function(e) {
    e.preventDefault();
    var link = $(this).attr('href');
    $(link).show().animate(
    {
        scrollTop: $(link).offset().top
    },800);;

});

$(".close").click(function(e) {
  e.preventDefault();
  $(this).closest("div.popupbox").hide();
  $('body,html').animate(
    {
        scrollTop: 0
    }, 800);
});

答案 2 :(得分:1)

$('#foo',function(event) {
    event.preventDefault();
});

答案 3 :(得分:1)

尝试event.preventDefault()

$(".show").click(function(event) {
    event.preventDefault();
    var link = $(this).attr('href');
    $(link).show();

});

$(".close").click(function(event) {
    event.preventDefault();
    $(this).closest("div.popupbox").hide();
});

文档http://api.jquery.com/event.preventDefault/