2

普段はjQueryを使っていますが、Squarespaceでサイトを作るのは初めてで、すでにYUIを使っているので、ついつい手に取ってしまいます。

mouseenter でリンクが少しフェードし、mouseleave で再び不透明になる単純な効果が必要です。

いくつかの YUI の例を見て、これが今の私のコードです:

 YUI().use('*',function(Y){

 //GET THAT CART UP THERE!
Y.on("domready", function() {

    var over = function(e){
  e.currentTarget.transition({
    duration:0.5,
    opacity:0.5
  });
    };

    var out = function(e){
e.currentTarget.transition({
    duration:0.5,
    opacity:1
  });
    };
Y.all('a').on('mouseenter',over);
Y.all('a').on('mouseleave',out);
});
    });

ページが読み込まれると、エラーなどは発生しませんが、リンクにカーソルを合わせても効果はありません。

ありがとう！

4

2 に答える 2

2

一見すると、コードの本体は機能するはずです。何が起こっているのかは、YUI遷移モジュールが実際にロードされていないことだと思います。use（'*'）をuse（'transition'）に変更してみてください。

use（' '）では、' 'は「可能なすべてのYUIモジュールをフェッチしてアタッチする」という意味ではないことに注意してください。これは、実際には、「このページにすでに存在するすべてのYUIモジュールを取得し、ここに添付する」ことを意味します。つまり、ページのどこかで、遷移モジュールを明示的にロードする必要があります。

于 2012-11-16T22:47:03.113 に答える
2

使用するときuse('*')は、必要なすべてのファイルが既にページに含まれていることを確認してください。私の推測では、そうではありません。

それ以外の場合は、ローダーを使用してファイルの読み込みを処理し、使用するモジュールに必要なすべてのファイルと依存関係を取得できます。

ローダーを使用すると、次のようになります。

YUI().use('node', 'transition', function(Y){

  //GET THAT CART UP THERE!
  Y.on("domready", function() {

    var over = function(e){
      e.currentTarget.transition({
        duration:0.5,
        opacity:0.5
      });
    };

    var out = function(e){
      e.currentTarget.transition({
        duration:0.5,
        opacity:1
      });
    };

    Y.all('a').on('mouseenter',over);
    Y.all('a').on('mouseleave',out);
  });
});
于 2012-11-16T22:50:11.713 に答える