2015-09-05 112 views
2

嗨,当你点击一个链接,我希望它切换'vartalo'没有页面滚动到顶部,我想'A'链接,但不希望它滚动翻页。href#移动滚动位置

<!DOCTYPE html > 
<html>  
<style>  
#oikea{ 
position:absolute; 
top:800px; 
}  

.paneelinvartalo{ 
border:1px solid black; 
background-color:lightblue; 
margin-top:5px;  
padding:15px;  
height:200px; 
width:200px; 
} 

</style> 
<body>  
<div id="panel1" class="paneelinvartalo">vartalo  
</div> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"> 
</script> 

<script> 
$(function(){  
    $('.nappulat').click(function(){ 
    $('#panel1').toggle(200);    
    }); 
    }); 

</script> 
<div id="oikea" > 
<a class="nappulat" href="#" rel="">A< /a>  
</div>  
</body>  
</html> 

回答

0

就这么把你带到页面顶部的链接的默认操作。网址#是空的书签,与链接到位于页面顶部的已命名书签锚点的书签相同。

使用preventDefault方法阻止链接的默认操作:

$('.nappulat').click(function(e){ 
    e.preventDefault(); 
    $('#panel1').toggle(200); 
}); 
0
$(function(){  
    $('.nappulat').click(function(event){ 
     event.preventDefault(); 
     $('#panel1').toggle(200); 
    }); 
});