0

mootools.js 1.3.2 と mootools-more.js の使用

私が知る限り、これは div を表示し、コンテンツと linkTab div を同時に非表示にすることになっています。

$('blogLink').addEvent('click', function(){
 $('homeLink').removeClass('active'); 
 $('linkTab').removeClass('active'); 
 $('blogLink').addClass('active');  
 content.slideOut();
 linkTab.slideOut();
 blogLink.slideIn();
});

これはHTMLです

<a href="#" id="blogLink">Blog</a>
<div id="blogContent">
content here
</div>

すべて正常に動作し、問題ありませんが、これに加えて、http://mysite.com/#blogLink のような URL を人々に提供し、その blogContent div を開いてもらいたいと考えています。これを行うと、ページの上部に移動し、blogContent div が非表示になります。

どうすればそれを達成できますか？mootools-smoothscroll.js を追加して、http://davidwalsh.name/smooth-scroll-mootools で概説されている方法を使用しようとしましたが、ページ全体が壊れただけで、正しく読み込まれませんでした。

私は mootools の経験がなく、Javascript が苦手なので、あなたが説明しようとしていることを「理解」するのに時間がかかったらすみません。

どうもありがとう。

4

1 に答える 1

0

まず、あなたは特に MooTools に愛着を持っていますか? あなたが JavaScript の初心者なら、おそらくjQueryの方が使いやすく、間違いなくより大きなサポート コミュニティがあります。しかし、今のところ MooTools で動作するはずのソリューションを投稿します。

私があなたを正しく理解していれば、あなたが達成したいことは次のとおりです。

  • 「ブログ」をクリックすると、投稿した匿名機能が実行されます
  • この関数は、誰かが#blogLinkURL に含まれるページにアクセスした場合にも実行されます。

それを達成するのはそれほど難しくありません:

// Once the DOM has loaded - so that our elements are definitely available
window.addEvent('domready', function() {
    // Check for #blogLink hashtag, and reveal blog
    if(window.location.hash == 'blogLink') { revealBlog(); }

    // Make sure blog is revealed when link is clicked
    $('blogLink').addEvent('click', revealBlog);
});

function revealBlog() {
    $('homeLink').removeClass('active'); 
    $('linkTab').removeClass('active'); 
    $('blogLink').addClass('active');  
    content.slideOut();
    linkTab.slideOut();
    blogLink.slideIn();
}

リンク マークアップを次のように変更することもできます。

<a href="#blogLink" id="blogLink">Blog</a>

ブログが公開されたときに常に正しいリンクにアクセスできるようにするため。

于 2011-08-15T23:06:20.350 に答える