سلام،
با این اموزش می تونید دو افکت زیبا در اواتار خود در ویبولتین ایجاد کنید
با این اموزش می تونید دو افکت زیبا در اواتار خود در ویبولتین ایجاد کنید
ابتدا چرخشی یا 360 Degrees Turn
برای مشاهده لینک نیاز به ثبت نام دارید؛ برای ثبت نام کلیک کنید
وقتی نشانگر ماوس را روی تصویر ببرید،360 درجه خواهد چرخید!برای اینکار ابتدا قالب additional.css را باز کرده و در ابتدای آن کد های زیر را قرار دهید:
کد:
[SIZE=2].myavatar:hover { transition: all 3s ease; [/SIZE][SIZE=2]-webkit-transition: all 3s ease; [/SIZE]
[SIZE=2]-moz-transition: all 3s ease; transform:rotate(360deg); [/SIZE]
[SIZE=2]-moz-transform:rotate(360deg); [/SIZE]
[SIZE=2]-webkit-transform:rotate(360deg); position:relative;[/SIZE]
[SIZE=2]}[/SIZE]
در مرحله بعدی قالب postbit_legacy را باز کنید و کد زیر را پیدا کنید (قبل اینکار از کل کدها یه کپی بگیرید)
و حالا جایگزین کنید با کد زیر:
HTML:
<img src="{vb:raw post.avatarurl}" alt="{vb:rawphrase xs_avatar, {vb:raw post.username}}" title="{vb:rawphrase xs_avatar, {vb:raw post.username}}" />
و حالا جایگزین کنید با کد زیر:
HTML:
<div class="myavatar"><img src="{vb:raw post.avatarurl}" alt="{vb:rawphrase xs_avatar, {vb:raw post.username}}" title="{vb:rawphrase xs_avatar, {vb:raw post.username}}" /></div>
و ذخیره.
بخش دوم افکت بزرگنمایی (کوچیک نمایی حالا هرچی
) Zoom Out Effect
بخش دوم افکت بزرگنمایی (کوچیک نمایی حالا هرچی
برای مشاهده لینک نیاز به ثبت نام دارید؛ برای ثبت نام کلیک کنید
کد های زیر را در ابتدای قالب
additional.css قرار دهید
کد:
[COLOR=#000000][SIZE=2][FONT=tahoma][RIGHT].myavatar:hover { opacity: 1; filter: alpha(opacity=100);
[/RIGHT]
[/FONT][/SIZE][/COLOR][SIZE=2][FONT=tahoma][RIGHT]
[/RIGHT]
[/FONT][/SIZE][COLOR=#000000][FONT=tahoma][SIZE=3][RIGHT]
[SIZE=2]transition: all 2s ease; [/SIZE]
[/RIGHT]
[/SIZE][/FONT][/COLOR][FONT=tahoma][SIZE=3][RIGHT]
[COLOR=#000000][SIZE=2]-webkit-transition: all 2s ease; [/SIZE][/COLOR]
[COLOR=#000000][SIZE=2]-moz-transition: all 2s ease;[/SIZE][/COLOR]
[COLOR=#000000][SIZE=2]transform:rotate(0deg); [/SIZE][/COLOR]
[COLOR=#000000][SIZE=2]-moz-transform:rotate(0deg); [/SIZE][/COLOR]
[COLOR=#000000][SIZE=2]-webkit-transform:rotate(0deg);[/SIZE][/COLOR]
[COLOR=#000000][SIZE=2]transform: scale(1.5); [/SIZE][/COLOR]
[COLOR=#000000][SIZE=2]-webkit-transform: scale(1.5); [/SIZE][/COLOR]
[COLOR=#000000][SIZE=2]-moz-transform: scale(1.5);[/SIZE][/COLOR]
[COLOR=#000000][SIZE=2]position:relative;[/SIZE][/COLOR]
[COLOR=#000000][SIZE=2]
[/SIZE][/COLOR]
[COLOR=#000000][SIZE=2]}[/SIZE][/COLOR]
[/RIGHT]
[/SIZE][/FONT][FONT=tahoma][SIZE=3][RIGHT]
[/RIGHT]
[SIZE=2]
ادامه مراحل رو هم که قبل انجام دادیم دیگه نیازی به تکرار کردن ندارد.
[/SIZE][/FONT]