SCLUB免費論壇申請-使用者論壇's Archiver

Yenifer 發表於 2013-10-29 21:08

分享一个让帖内投像360度旋转的代码

[code] <style>
#viewthread .avatar img{
width:100px;
height:100px;
transition:width 2s, height 2s;
-moz-transition:width 2s, height 2s, -moz-transform 2s; /* Firefox 4 */
-webkit-transition:width 2s, height 2s, -webkit-transform 2s; /* Safari and Chrome */
-o-transition:width 2s, height 2s, -o-transform 2s; /* Opera */
}

#viewthread .avatar img:hover
{
width:100px;
height:100px;
transform:rotate(180deg);
-moz-transform:rotate(360deg); /* Firefox 4 */
-webkit-transform:rotate(360deg); /* Safari and Chrome */
-o-transform:rotate(360deg); /* Opera */
}
</style>[/code]头部或者第三方

gta-zygx 發表於 2013-10-29 21:55

支持[b][/b]

章鱼 發表於 2013-10-29 22:15

这里要说一下,坑爹的dz把用户组头像的图片也放在.avatar里面了...所以这个代码不能用于使用了用户组头像的论坛

superman1024 發表於 2013-10-29 23:04

給樓主頂一下唷

憨憨兒 發表於 2013-10-29 23:09

謝謝教學

pigeon 發表於 2013-10-30 07:13

章鱼博学多才。

Yenifer 發表於 2013-10-30 08:49

[b]回復 [url=http://www.sclub.com.tw/discuz/redirect.php?goto=findpost&pid=199167&ptid=26072]3#[/url] [i]章鱼[/i] [/b]


    你说的那个用户组头像我还真没测试

不过代码与代码之间不都是存在着一点点相互排斥的么,只能二选一咯

章鱼 發表於 2013-10-30 12:51

[b]回復 [url=http://www.sclub.com.tw/discuz/redirect.php?goto=findpost&pid=199199&ptid=26072]7#[/url] [i]Yenifer[/i] [/b]


   
是的,这个东西很令人头疼,导致要改头像大小等等必须用极其麻烦的方法来做......

sf2tmakss 發表於 2013-10-30 20:43

感謝大大的分享~

xiangzi8821 發表於 2013-11-1 12:56

前排支持!
代码这东西,追求完美是很累的事。
喜欢研究,懂得分享才是最赞的。
资源贴,无条件支持!

Kajes 發表於 2015-7-14 19:37

用户组头的话,可以直接兩個刪了
Width:100px;
Height100px;
然後头像大小就不用改了 ^^[code] <style>
#viewthread .avatar img{
transition:width 2s, height 2s;
-moz-transition:width 2s, height 2s, -moz-transform 2s; /* Firefox 4 */
-webkit-transition:width 2s, height 2s, -webkit-transform 2s; /* Safari and Chrome */
-o-transition:width 2s, height 2s, -o-transform 2s; /* Opera */
}

#viewthread .avatar img:hover
{
transform:rotate(180deg);
-moz-transform:rotate(360deg); /* Firefox 4 */
-webkit-transform:rotate(360deg); /* Safari and Chrome */
-o-transform:rotate(360deg); /* Opera */
}
</style>[/code]

恒小杰 發表於 2019-8-24 15:39

感谢分享

頁: [1]

Powered by Discuz! Archiver 7.2  © 2001-2009 Comsenz Inc.