Question

我的页面上有许多链接，它们调用一些jquery代码来打开视频。页面上的链接列表可能会很长。当有人点击链接时，我希望它能够将您定位到视频打开的页面部分（<div id="player">）。我认为加入<a href="#player"...就可以了。我错过了什么？

<div id="player"></div>
<a href="#player" onclick="DoNav('<?php echo $url; ?>');"> <?php echo $result_videos[$i]["camera_name"]; ?> </a>

<script type="text/javascript">
function DoNav(theUrl)
{
  // only add the player if it doesn't yet exist
  if($('#myfileplayer').length == 0) {
    var mydiv = $("#player");
    var myvideo = $("<video id='myfileplayer' src='"+ theUrl + "' width='320' height='240' controls></video>");
    mydiv.append(myvideo);
  } else {
    $('#myfileplayer').attr("src",theUrl); 
  }

} 
</script>

上面的代码适用于第一次点击视频，但它会将您置于视频播放器下而不是顶部。我第二次在链接列表中单击并单击一个，它根本不做任何事情。

我也尝试在div上方添加<a name="blah"></a>（即html4），然后将href更改为：<a href="#blah"...。这也不起作用。

Answer 1

如果我理解正确，您希望在点击链接时将您的窗口滚动到div＃player top？

然后你可以在打开视频时通过jQuery执行此操作

这样的事情可以解决问题：

$("yourLinkSelector").live('click', function(evnt){
    evnt.preventDefault();
    $('html, body').animate({scrollTop:$("div#player").offset().top - 50}, "slow");
    //then your code to open the video
});

html链接转到页面顶部

1 个答案: