0

このクールなjavascript/cssエフェクトは、リンクにカーソルを合わせたときに3Dキューブローラーエフェクトを作成することがわかりました。問題は、それを実装しようとすると、それを機能させることができないことです（おそらく私の初心者のjavascriptスキル）。

これは効果です：

http://jsfiddle.net/hakim/Ht6Ym/

これが私のスタイルシートです。

と私のサイト：

http://goo.gl/1KbHb

私が使用したJSは次のとおりです。

<script type='text/javascript'>

    var supports3DTransforms =  document.body.style['webkitPerspective'] !== undefined || 
                                document.body.style['MozPerspective'] !== undefined;

    function linkify( selector ) {
        if( supports3DTransforms ) {

            var nodes = document.querySelectorAll( selector );

            for( var i = 0, len = nodes.length; i < len; i++ ) {
                var node = nodes[i];

                if( !node.className || !node.className.match( /roll/g ) ) {
                    node.className += ' roll';
                    node.innerHTML = '<span data-title="'+ node.text +'">' + node.innerHTML + '</span>';
                }
            };
        }
    }

    linkify( 'a' ); 
    </script>
4

2 に答える 2

0

js コードの最後の 2 行 ( linkify( 'a' );) を削除し、それを書き直します。それは jsfiddle の問題であり、このようなすべてのサイト [StackOverFlow でさえ] です。そこには、関数呼び出しを違法にする隠された Unicode 文字があります。

于 2012-12-01T07:23:09.453 に答える
0

純粋なcssだけで同じことをしました。チュートリアルを読む:- http://www.howtokickblogger.com/2012/11/post-links-hover-effect.html

デモ > http://bit.ly/14AHwcc

楽しんで ：）

于 2013-08-11T19:36:30.633 に答える