|
Форум сайта » Система uCoz » Пользователи » Новый оригинальный мини-профиль с 3D кнопками by Apocalypse |
Новый оригинальный мини-профиль с 3D кнопками by Apocalypse |
[Table]Предоставляю вашему вниманию мою новую разработку. Не судите строго - это экспериментальный образец, который я рискнул выложить на всеобщее обозрение пользователям системы uCoz. Данный скрипт я создавал два дня, из которых 90% времени я потратил на адаптацию подо все самые популярные браузеры: Google Chrome, Opera, Mozilla, IE. По всем вопросам и предложениям пишите в комментариях к этому материалу 1) Современный оригинальный профиль с динамичным контентом Установка: В то место, где будет располагаться данный профиль (Желательно использовать в глобальных блоках) вставляйте: [/Table]
Code <style type="text/css"> /* © Styles of Profile by Apocalypse*/ .roundabout-holder { width: 150; height: 200; overflow: hidden; margin: 0; position: relative; } .roundabout-moveable-item { width: 150; height: 10; opacity: 0.5; text-align: center; cursor: pointer; } .roundabout-in-focus { cursor: pointer; } .monolith { opacity:0.8; position: absolute; width: 50; <?if($USER_AGENT$='opera')?> top: 40; <?else?> top: 48; <?endif?> left: 48; padding:0; margin:0; z-index: 200; } .monolith .pad { padding: 0; text-align: center; color: #999; } .pad em { color: #eee; } /* © End styles of Profile by Apocalypse*/ </style> <center> <div align="center" class="holder"> <div class="monolith"> <div class="pad"> <center> <?if($USER_LOGGED_IN$)?><img width="50" src="$USER_AVATAR_URL$" class="reflect" border="0"><?else?><img src="/Apo/is.gif" class="reflect" width="50" border="0"><?endif?> </center> </div> </div> <?if($USER_LOGGED_IN$)?> <script type="text/javascript"> function iAjaxpm(){new _uWnd('link','Личные сообщения',800,550,{align:0,shadow:0,autosize:1,maxh:1000,minh:100,resize:1},'<iframe src="/index/14" scrolling="auto" frameborder="0" width="800" height="500"></iframe>');} </script> <script type="text/javascript"> function iAjaxprofile(){new _uWnd('link','Профиль',800,550,{align:0,shadow:0,autosize:1,maxh:1000,minh:100,resize:1},'<iframe src="/index/8" scrolling="auto" frameborder="0" width="800" height="500"></iframe>');} </script> <script type="text/javascript"> function iAjaxquit(){new _uWnd('link','Выход из профиля',400,200,{align:0,shadow:0,autosize:1,maxh:1000,minh:100,resize:1},'<center>В самом деле выйти из профиля?<br><br><a href="$LOGOUT_LINK$">ДА</a></center>');} </script> <script type="text/javascript"> function iAjaxedit(){new _uWnd('link','Редактирование личных данных',800,550,{align:0,shadow:0,autosize:1,maxh:1000,minh:100,resize:1},'<iframe src="/index/11" scrolling="auto" frameborder="0" width="800" height="600"></iframe>');} </script> <script type="text/javascript"> function iAjaxusers(){new _uWnd('link','Список пользователей',800,550,{align:0,shadow:0,autosize:1,maxh:1000,minh:100,resize:1},'<iframe src="/index/15-1" scrolling="auto" frameborder="0" width="800" height="500"></iframe>');} </script> <div class="moveme"><?if($USER_AGENT$='ie')?><a onclick="javascript:iAjaxpm();" title="Личные сообщения [<?if($IS_NEW_PM$)?>Есть новые сообщения ($UNREAD_PM$)<?else?>Нет новых сообщений]<?endif?>"><img class="reflect" src="/Apo/pm_ie.png" width="20" border="0"></a><?else?><a href="javascript:iAjaxpm();" title="Личные сообщения [<?if($IS_NEW_PM$)?>Есть новые сообщения ($UNREAD_PM$)<?else?>Нет новых сообщений]<?endif?>"><img src="/Apo/pm.png" width="20" border="0"><?endif?></a></div> <div class="moveme"><?if($USER_AGENT$='ie')?><a onclick="javascript:iAjaxprofile();" title="Ваш профиль"><img class="reflect" src="/Apo/profile_ie.png" width="20" border="0"></a><?else?><a href="javascript:iAjaxprofile();" title="Ваш профиль"><img src="/Apo/profile.png" width="20" border="0"><?endif?></a></div> <div class="moveme"><?if($USER_AGENT$='ie')?><a onclick="javascript:iAjaxquit();" title="Выйти из профиля"><img class="reflect" src="/Apo/logout_ie.png" width="20" border="0"></a><?else?><a href="javascript:iAjaxquit();" title="Выйти из профиля"><img src="/Apo/logout.png" width="20" border="0"><?endif?></a></div> <div class="moveme"><?if($USER_AGENT$='ie')?><a onclick="javascript:iAjaxedit();" title="Редактировать личные данные"><img class="reflect" src="/Apo/edit_ie.png" width="20" border="0"></a><?else?><a href="javascript:iAjaxedit();" title="Редактировать личные данные"><img src="/Apo/edit.png" width="20" border="0"><?endif?></a></div> <div class="moveme"><?if($USER_AGENT$='ie')?><a onclick="javascript:iAjaxusers();" title="Список пользователей"><img class="reflect" src="/Apo/users_ie.png" width="20" border="0"></a><?else?><a href="javascript:iAjaxusers();" title="Список пользователей"><img src="/Apo/users.png" width="20" border="0"><?endif?></a></div> <?else?> <div class="moveme"><a onmouseover="$LOGIN_LINK$" title="Войти в свой профиль"><?if($USER_AGENT$='ie')?><img class="reflect" src="/Apo/login_ie.png" width="20" border="0"><?else?><img src="/Apo/login.png" width="20" border="0"><?endif?></a></div> <div class="moveme"><a onmouseover="$LOGIN_LINK$" title="Войти в свой профиль"><?if($USER_AGENT$='ie')?><img class="reflect" src="/Apo/login_ie.png" width="20" border="0"><?else?><img src="/Apo/login.png" width="20" border="0"><?endif?></a></div> <div class="moveme"><a onmouseover="$LOGIN_LINK$" title="Войти в свой профиль"><?if($USER_AGENT$='ie')?><img class="reflect" src="/Apo/login_ie.png" width="20" border="0"><?else?><img src="/Apo/login.png" width="20" border="0"><?endif?></a></div> <div class="moveme"><a onmouseover="$LOGIN_LINK$" title="Войти в свой профиль"><?if($USER_AGENT$='ie')?><img class="reflect" src="/Apo/login_ie.png" width="20" border="0"><?else?><img src="/Apo/login.png" width="20" border="0"><?endif?></a></div> <div class="moveme"><a onmouseover="$LOGIN_LINK$" title="Войти в свой профиль"><?if($USER_AGENT$='ie')?><img class="reflect" src="/Apo/login_ie.png" width="20" border="0"><?else?><img src="/Apo/login.png" width="20" border="0"><?endif?></a></div> <?endif?> </div> </center> <script type="text/javascript" src="/Apo/reflection.js"></script> <script type="text/javascript" src="/Apo/Aposcript.js"></script> <script type="text/javascript" src="/Apo/jquery.easing.js"></script> <script type="text/javascript"> // © Profile by Apocalypse $(document).ready(function() { $('.holder').roundabout({ childSelector: '.moveme', easing: 'easeInOutBack', duration: 1400, maxOpacity: 0.9, minOpacity: 0.5, tilt: -2 }); }); // © Apo 2010 </script> [Table]Теперь создайте в Файловом менеджере папку Apo и залейте в неё все файлы из прикрелённого архива Скачать архив: http://apocalypse.ucoz.kz/_ld/17/1739__by_Apocalypse.rar [/Table] |
| |||
| |||