多数の Picasa アルバムが埋め込まれたページがあります。埋め込まれた各アルバムは<div>
、一意の ID を持つ 内にあります。
ブラウザで /photos/#UNIQUEID を指定し、正しいアルバムに焦点を合わせてページをロードできるようにしたいと考えています。
JavaScript を使用してこれを行うにはどうすればよいですか? 私のページは: http://goo.gl/jDZIK
多数の Picasa アルバムが埋め込まれたページがあります。埋め込まれた各アルバムは<div>
、一意の ID を持つ 内にあります。
ブラウザで /photos/#UNIQUEID を指定し、正しいアルバムに焦点を合わせてページをロードできるようにしたいと考えています。
JavaScript を使用してこれを行うにはどうすればよいですか? 私のページは: http://goo.gl/jDZIK
なぜJavaScriptを使用してこれを行うのですか?これはすでにブラウザのデフォルトの動作です。
http://www.outtheremusic.net/photos/#summer2010
このリンクは、テスト用に手元にあったブラウザ(Firefox、Opera、Chrome、Internet Explorer)で正しい画像にスクロールダウンします。
したがって、あなたの質問に対する答えは次のとおりです。あなたはそれをする必要はありません、ブラウザはすでにそれをします。ページ上の何かをクリックしながら、それをリロードせずに画像までスクロールダウンしたい場合、それは別の話です(そしてそれに関しては別の質問です)
window.location.href = '#HASH_NAME'?
編集しました。私の明らかな間違いを指摘してくれたCoryに感謝します。;) 乾杯!
ページには<h1>
、各アルバムの上に 1 つずつ、いくつかのタイトル要素があります。たとえば、URL~/photos/#album1
を「Album 1」という見出しの領域にジャンプさせたい場合は、HTML を少し変更するだけで済みます。これを行う「昔ながらの」方法は、アンカー<a>
要素に一致するname
属性を提供することでした。そう、
<h1>Album 1</h1>
次のように変更されます。
<a name="album1"></a><h1>Album 1</h1>
または、最新のブラウザはid
、ハッシュ値に一致する要素にジャンプするため、次のように簡単に実行できます。
<h1 id="album1">Album 1</h1>
ブラウザは残りを処理する必要があります。id
ページ上のすべての が一意であることを確認してください。参考までに: 要素にジャンプするというアイデアは好きではありませんでし<div>
た。見出しがビューポートから切り取られてしまうからです。
jQueryを使用すると、誰かがdivをクリックしたときに、目的の場所に送信するように指定できます。
$("div").click(function(){
var UniqueID = $(this).prop('id');
window.location.href = "www.servername.com/photos/#" + UniqueID;
});