Современный облачный хостинг провайдер | Aéza
Контакты ООО "АЕЗА ГРУПП" ИНН 2312304914 ОГРН 1212300056430

XF 1.5 Анимация логотипа

Статус
В этой теме нельзя размещать новые ответы.
chit24

chit24

Проверенные
Сообщения
204
Реакции
16
Баллы
3,320
Всем добрый вечер хотел спросить может кто знает как сделать анимацию логотипа ???
У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация
 
  • Мне нравится
Реакции: Len
Сортировка по дате Сортировка по голосам
В EXTRA.css.
Код: 
#logo img {
    animation: hue 120s linear infinite;
    -webkit-animation: hue 120s linear infinite;
}
@-webkit-keyframes hue {
    0% { -webkit-filter: hue-rotate(0deg); }
    50% { -webkit-filter: hue-rotate(360deg); }
    100% { webkit-filter: hue-rotate(0deg); }
}
@-moz-keyframes hue {
    0% { filter: hue-rotate(0deg); }
    50% { filter: hue-rotate(360deg); }
    100% { filter: hue-rotate(0deg); }
}
@-ms-keyframes hue {
    0% { filter: hue-rotate(0deg); }
    50% { filter: hue-rotate(360deg); }
    100% { filter: hue-rotate(0deg); }
}
@-o-keyframes hue {
    0% { filter: hue-rotate(0deg); }
    50% { filter: hue-rotate(360deg); }
    100% { filter: hue-rotate(0deg); }
}
@keyframes hue {
    0% { filter: hue-rotate(0deg); }
    50% { filter: hue-rotate(360deg); }
    100% { filter: hue-rotate(0deg); }
}
 
Позитивный голос 0 Негативный голос
Mirovinger написал(а):
В EXTRA.css.
Код: 
#logo img {
    animation: 120s linear 0s normal none infinite running hue;
}
@keyframes hue {
0% {
    filter: hue-rotate(0deg);
}
50% {
    filter: hue-rotate(360deg);
}
100% {
}
}
@keyframes hue {
0% {
    filter: hue-rotate(0deg);
}
50% {
    filter: hue-rotate(360deg);
}
100% {
    filter: hue-rotate(0deg);
}
}
@keyframes hue {
0% {
    filter: hue-rotate(0deg);
}
50% {
    filter: hue-rotate(360deg);
}
100% {
    filter: hue-rotate(0deg);
}
}
Или.
Код: 
#logo img {
    animation: hue 120s linear infinite;
    -webkit-animation: hue 120s linear infinite;
}
@-webkit-keyframes hue {
    0% { -webkit-filter: hue-rotate(0deg); }
    50% { -webkit-filter: hue-rotate(360deg); }
    100% { webkit-filter: hue-rotate(0deg); }
}
@-moz-keyframes hue {
    0% { filter: hue-rotate(0deg); }
    50% { filter: hue-rotate(360deg); }
    100% { filter: hue-rotate(0deg); }
}
@-ms-keyframes hue {
    0% { filter: hue-rotate(0deg); }
    50% { filter: hue-rotate(360deg); }
    100% { filter: hue-rotate(0deg); }
}
@-o-keyframes hue {
    0% { filter: hue-rotate(0deg); }
    50% { filter: hue-rotate(360deg); }
    100% { filter: hue-rotate(0deg); }
}
@keyframes hue {
    0% { filter: hue-rotate(0deg); }
    50% { filter: hue-rotate(360deg); }
Нажмите для раскрытия...
не работает
У Вас недостаточно прав для просмотра ссылок. Вход или Регистрация
 
Позитивный голос 0 Негативный голос
Mirovinger написал(а):
Код покажите из EXTRA.css, похоже там есть ошибки.
Нажмите для раскрытия...
Код: 
#BRCopyright { display: none; }
#brmsNav .itemContent .counter span {border-radius:0px!important;}
.node .subForumList li {
width: 35% !important;
}
li a.redactor_btn_custom_line:before  {
    content: "\f068";
}
html .redactor_toolbar li a.redactor_btn_custom_virtot {
    background-position: 3px 3px!important;
}
.bbCodeQuote .quoteContainer .quote {
  max-height: 100% !important;
}

.messageUserBlock .extraUserInfo dl:first-child {
   background: none !important;
   padding-bottom: 0px;
   margin-bottom: -5px;
}

.userBanner.admin
{
  background: url(groups/v4.1/admin.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.AvatarCropControl.avatar.NoOverlay.Av1198l > img {
    height: 95px;
}
.userBanner.glmod
{
  background: url(groups/v4.1/glmod.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.bft
{
  background: url(groups/v4.1/bft.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.mod
{
  background: url(groups/v4.1/moder.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.nyashka
{
  background: url(groups/v4.1/nyashka.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.uct
{
  background: url(groups/v4.1/ucteam.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.smot
{
  background: url(groups/v4.1/smotr.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.diz
{
  background: url(groups/v4.1/diz.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.publ
{
  background: url(groups/v4.1/publ.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.seller
{
  background: url(groups/v4.1/seller.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.prem
{
  background: url(groups/v4.1/prem.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.coder
{
  background: url(groups/v4.1/coder.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.rev
{
  background: url(groups/v4.1/reverser.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.prof
{
  background: url(groups/v4.1/prof.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.ekspert
{
  background: url(groups/v4.1/ekspert.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.ych
{
  background: url(groups/v4.1/ych.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.mestn
{
  background: url(groups/v4.1/mestn.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.user
{
  background: url(groups/v4.1/user.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.novoreg
{
  background: url(groups/v4.1/novoreg.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.kidok
{
  background: url(groups/v4.1/kidok.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.zabanen
{
  background: url(groups/v4.1/zabanen.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.bb
{
  background: url(groups/v4.1/bb.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.fucker
{
  background: url(groups/v4.1/sf.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.ss
{
  background: url(groups/v4.1/ss.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.userBanner.lady
{
  background: url(groups/v4.1/lady.png) no-repeat;
  display: block;
  width: 168px;
  height: 27px;
  color: rgba(0, 0, 0, 0);
  top: -5px;
  margin-top: 3px;
}
.nodeInfo .categoryad{position:relative;float:right;}
div.categoryText h3.nodeTitle div.categoryad{margin:0;float:left;}

/* START - Hide forum title only on forum_list */
.forum_list .titleBar {
display: none;
}
/* END - Hide forum title only on forum_list */

.staffonlinelist li {
float: left;
margin-top: 3px;
}
.staffonlinelist img {
height: 32px;
width: 32px;
margin-right:5px;
padding: 2px;
}


 
  .avatar.NoOverlay > img {
top: 0px !important;
height:185px;
width:180px ;
left: 0px !important;
}

.emCtrl:hover, .emCtrl:focus, .ugc a:hover, .ugc a:focus {
    box-shadow: 5px 5px 7px rgba(255, 255, 255, 0);
}

.messageText img, .messageText iframe, .messageText object, .messageText embed {margin-bottom: -7px;}

.predxen {
  margin: 10px 0px 0 0px;
  padding: 5px 13px 5px 13px;
  background-color: #141414;
  font-size: 12px;
}

.subicon {
  background: url('styles/chit24/subform_nonew.png') no-repeat 0 50%;
  width: calc( 50% - 30px );
  padding: 0 15px 0 15px;
  margin: 0;
  float: left;
}

::-webkit-scrollbar {
width: 10px;
height:50px;
}

::-webkit-scrollbar-track-piece {
background-color: rgb(34, 34, 34);
-webkit-border-radius: 4px;
}

::-webkit-scrollbar-thumb:vertical {
height: 5px;
background-color: orange;
-webkit-border-radius: 5px;
}

::-webkit-scrollbar-thumb:vertical:active {
height: 5px;
background-color: orange;
-webkit-border-radius: 5px;
}


.pref.vazno
{
  color: rgb(255, 165, 0);
  text-shadow: 0 0 3px orange;
}
.pref.zakr
{
  color: grey;
  text-shadow: 0 0 3px grey;
}
.pref.mix
{
  color: #FFA07A;
  text-shadow: 0 0 3px #FFA07A;
}
.pref.zabugor
{
  color: #FFE4B5;
  text-shadow: 0 0 3px #FFE4B5;
}
.pref.myr
{
  color: #00FF7F;
  text-shadow: 0 0 3px #00FF7F;
}
.pref.detected
{
  color: red;
  text-shadow: 0 0 3px red;
}
.pref.undetected
{
  color: #7FFF00;
  text-shadow: 0 0 3px #7FFF00;
}
.titlebox {
   background: #141414;
  color: white;
  text-shadow: 0 0 0 transparent, 0 -1px 0 rgba(0, 0, 0, 0.8);
  padding: 15px 15px 15px 15px;
  overflow: hidden;
  margin-bottom: 10px;
}
.titlebox h1 {
  color: rgb(235, 235, 235);
  font: 18px/1.4 Helvetica, Arial, sans-serif;
}
.sidebar .section {
 border-top: 1px solid rgba(255, 165, 0, 0.8);
 box-shadow: 0 -5px 4px -4px rgba(255,165,0,0.35);
}
.section.sectionMain.nodeList.taigachat_alt.taigachat_reverse {
 border-top: 1px solid rgba(255, 165, 0, 0.8);
 box-shadow: 0 -5px 4px -4px rgba(255,165,0,0.35);
}
    #panel {
        float: right;
        color: #a0a0a0;
        text-align: right;
            line-height: 45px;
            border-right: 1px solid rgb(5, 5, 5);
    }
    #panel .links a {
        display: inline-block;
            padding: 0px 15px;
            color: white;
    }
    #panel .links a:hover {
        color: #fff;
        text-decoration: none;
        background: rgba(0, 0, 0, 0.21);
    }
    #menu {
        font-family: 'Roboto', Arial, Sans-Serif;
        font-size: 15px;
        font-weight: bold;
        width: auto;
        min-height: 34px;
        box-shadow: 1px 1px 3px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.15);
        -webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.15);
        -moz-box-shadow: 1px 1px 3px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.15);
    }
    #menu ul {
        height: 45px;
        background-color: rgb(34, 34, 34);
    }
    #menu li {
        float: left;
        padding: 0px;
    }
    #menu li a {
        display: block;
        font-weight: normal;
        line-height: 45px;
        margin: 0px;
        padding: 0px 25px;
        text-align: center;
        text-decoration: none;
        border-right: 1px solid rgba(255, 255, 255, 0.04);
        _border-right: 1px solid rgb(255, 255, 255);
        border-left: 1px solid rgba(2, 2, 2, 0.42);
        margin-bottom: 1px;
    }
    #menu > ul > li > a {
        color: #fff;
    }
    #menu ul ul a {
        color: #fff;
    }
    #menu li > a:hover, #menu ul li:hover > a {
        text-decoration: none;
        background: rgba(0, 0, 0, 0.21);

  text-shadow: 0px 1px 1px #000;
  border-top: 3px solid orange;
  transition: all 0.2s ease 0s;
    }
    #menu li ul {
        background: #333333;
        display: none;
        height: auto;
        padding: 0px;
        margin: 0px;
        border: 0px;
        position: absolute;
        width: 225px;
        z-index: 200;
    }
    #menu li:hover ul {
    display: block;
    }
    #menu li li {
        display: block;
        float: none;
        margin: 0px;
        padding: 0px;
        width: 225px;
    }
    #menu li:hover li a {
        background: none;
    }
    #menu li ul a {
        display: block;
        height: 45px;
        font-size: 12px;
        font-style: normal;
        margin: 0px;
        padding: 0px 10px 0px 15px;
        text-align: left;
    }
    #menu li ul a:hover,
    #menu li ul li:hover > a {
        background: #444;
        border: 0px;
        color: #fff;
        text-decoration: none;
    }

.extraContactInfo {
margin: 2px 0 0;
background: #101010;
padding: 5px;
}
.pff2 {
margin: 2px 0 0;
background: #101010;
margin-bottom: -3px;
padding-top: 3px;
}
.pff {
position: relative;
padding: 1px 0 3px;
}
#logoBlock #logo
{
float:none;
text-align:center;
}

.thread_view .tagList .tag {
  color: #ffffff;
}









.formPopup .primaryControls {
    margin-top: -10px;
}



#navigation .navTabs .navLink:hover {
    text-decoration: none;
    background: rgba(0, 0, 0, 0.21);
    text-shadow: 0 0 0 transparent, 0px 1px 1px #000;
    border-top: 3px solid orange;
    transition: all 0.2s ease 0s;
}   
#navigation .navTab .navLink {
    display: block;
    font-weight: normal;
    margin: 0px;
    padding: 0px 16px;
    text-align: center;
    text-decoration: none;
    border-left: 1px solid rgba(2, 2, 2, 0.42);
    margin-bottom: 1px;
}
#navigation .navTab .navLink:before {
    display: inline-block;
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    padding-right: 6px;
}     
#navigation .navTab.home .navLink:before {
    content: "\f015";
}
#navigation .navTab.siropuCustomTab.custom-tab-4 .navLink:before {
    content: "\f183";
}
#navigation .navTab.siropuCustomTab.custom-tab-3 .navLink:before {
    content: "\f05e";
}
#navigation .navTab.siropuCustomTab.custom-tab-5 .navLink:before {
    content: "\f059";
}
#navigation .navTab.siropuCustomTab.custom-tab-1 .navLink:before {
    content: "\f219";
}
#navigation .navTab .navLink.rynok:before {
    content: "\f19c";
}
#navigation .navTab.siropuCustomTab.custom-tab-7 .navLink:before {
    content: "\f232";
}
#navigation .navTab.siropuCustomTab.custom-tab-8 .navLink:before {
    content: "\f03e";
}
#navigation .navTab .navLink.Фотохостинг:before {
    content: "\f03e";
}
#navigation .navTab.siropuCustomTab.custom-tab-9 .navLink:before {
    content: "\f085";

#logo img {
    animation: 120s linear 0s normal none infinite running hue;
}
@keyframes hue {
0% {
    filter: hue-rotate(0deg);
}
50% {
    filter: hue-rotate(360deg);
}
100% {
}
}
@keyframes hue {
0% {
    filter: hue-rotate(0deg);
}
50% {
    filter: hue-rotate(360deg);
}
100% {
    filter: hue-rotate(0deg);
}
}
@keyframes hue {
0% {
    filter: hue-rotate(0deg);
}
50% {
    filter: hue-rotate(360deg);
}
100% {
    filter: hue-rotate(0deg);
}
}
 
Позитивный голос 0 Негативный голос
Данный код подправьте.
Код: 
#navigation .navTab.siropuCustomTab.custom-tab-9 .navLink:before {
    content: "\f085";
Должно быть так.
Код: 
#navigation .navTab.siropuCustomTab.custom-tab-9 .navLink:before {
    content: "\f085";
}
 
Позитивный голос 0 Негативный голос
Mirovinger написал(а):
Данный код подправьте.
Код: 
#navigation .navTab.siropuCustomTab.custom-tab-9 .navLink:before {
    content: "\f085";
Должно быть так.
Код: 
#navigation .navTab.siropuCustomTab.custom-tab-9 .navLink:before {
    content: "\f085";
}
Нажмите для раскрытия...
помогло
 
Позитивный голос 0 Негативный голос
Статус
В этой теме нельзя размещать новые ответы.
Современный облачный хостинг провайдер | Aéza
Контакты
ООО "АЕЗА ГРУПП" ИНН 2312304914 ОГРН 1212300056430 г. Краснодар, ул. Маяковского 160, офис 2.4

Похожие темы

M
  • Вопрос
XenForo 2.x.x Анимация загрузки при заходе на форум
Ответы
1
Просмотры
256
sancak
sancak
A
  • Закрыта
  • Решено
XF 2.2 Как сделать такой же анимированный текст?
Ответы
6
Просмотры
599
Aosodo
A
ФАКЕР
  • Вопрос
XF 2.2 Как массово установить права всем пользователям?
Ответы
4
Просмотры
332
Rankin
R
K
  • Вопрос
XF 2.2 Проблема с почтой на форуме
Ответы
1
Просмотры
227
CrazyHackGUT
CrazyHackGUT
Not Weak
  • Закрыта
  • Вопрос
XF 2.3 Кто знает как решить проблемы!
Ответы
5
Просмотры
262
Matew
Matew
Назад
Сверху Снизу