私はリンクされたウェブサイト、css3またはjqueryでアニメーションがどのように行われたかを理解しようとしていますか？

http://alpha.patterntap.com/私はリンクされたウェブサイト、css3またはjqueryでアニメーションがどのように行われたかを理解しようとしていますか？

あなたは、画像の上にマウスを置く場合には、内側にアニメーション化すてきな境界線を気づくには、CSS3の挿入図の影で行われていることでしょうか？それともjqueryなの？

2010-12-19 android.nick

あなたはどの画像を意味するのですか – Breezer

それは具体的には、あなたがここでそれを見ることができる仕事、-webkit-transitionでCSS3です：

.list .item .shad { 
    position:relative; 
    top:-1px; 
    margin:1px 0 -1px; 
    border:1px solid #000; 
    opacity:0.25; 
    -moz-opacity:0.25; 
    filter:alpha(opacity=25); 
    -webkit-transition:all 0.1s linear; /* here! */ 
}

それは、これらのプロパティ値をアニメーションです：

.list .item:hover .shad{ 
    top:-10px; 
    margin:10px 0 -10px; 
    background:rgba(0,0,0,0.5); 
    border:11px solid #050505; 
    opacity:0.85; 
    -moz-opacity:0.85; 
    filter:alpha(opacity=85); 
}

を

出典

2010-12-19 00:42:53

この質問を投稿する前にCSSの要素にそれを適用しようとしましたが、うまくいきませんでした。もう一度やり直してみます。ありがとう、あなたはいつも私に必要な答えをくれています。 –

JSのようです。 CSSのトランジションやアニメーションなどを見つけることができませんでした。また、この効果にかなり似ています：

http://css-tricks.com/inset-border-effect/

出典

2010-12-19 00:35:30 sdleihssirhc

CSSを見てから考えていたのは、上記の答えに影響を与えたからですイオン、それは何もしなかったが、私はちょうど何か間違っていたと思うし、それはCSSです。 –

私はリンクされたウェブサイト、css3またはjqueryでアニメーションがどのように行われたかを理解しようとしていますか？

答えて

関連する問題