Эффект плавного затухания логотипа

А можно ли сделать функцию свечения при наведении?

В 05.09.2017 в 19:17, Hundmann сказал:

А можно ли сделать функцию свечения при наведении?

a#elLogo:hover {
    opacity: 1;
    -moz-transition-property: opacity;
    -moz-transition-duration: 1s;
    -moz-transition-delay: 0s;
    -webkit-transition-property: opacity;
    -webkit-transition-duration: 1s;
    -webkit-transition-delay: 0s;
    -o-transition-property: opacity;
    -o-transition-duration: 1s;
    -o-transition-delay: 0s;
    transition-property: opacity;
    transition-duration: 1s;
    transition-delay: 0s;
}
a#elLogo {
    display: inline;
    opacity: .4;
    -moz-transition-property: opacity;
    -moz-transition-duration: 1s;
    -moz-transition-delay: 0s;
    -webkit-transition-property: opacity;
    -webkit-transition-duration: 1s;
    -webkit-transition-delay: 0s;
    -o-transition-property: opacity;
    -o-transition-duration: 1s;
    -o-transition-delay: 0s;
    transition-property: opacity;
    transition-duration: 1s;
    transition-delay: 0s;
}

3 часа назад, War75 сказал:

a#elLogo:hover {
    opacity: 1;
    -moz-transition-property: opacity;
    -moz-transition-duration: 1s;
    -moz-transition-delay: 0s;
    -webkit-transition-property: opacity;
    -webkit-transition-duration: 1s;
    -webkit-transition-delay: 0s;
    -o-transition-property: opacity;
    -o-transition-duration: 1s;
    -o-transition-delay: 0s;
    transition-property: opacity;
    transition-duration: 1s;
    transition-delay: 0s;
}
a#elLogo {
    display: inline;
    opacity: .4;
    -moz-transition-property: opacity;
    -moz-transition-duration: 1s;
    -moz-transition-delay: 0s;
    -webkit-transition-property: opacity;
    -webkit-transition-duration: 1s;
    -webkit-transition-delay: 0s;
    -o-transition-property: opacity;
    -o-transition-duration: 1s;
    -o-transition-delay: 0s;
    transition-property: opacity;
    transition-duration: 1s;
    transition-delay: 0s;
}

 

Это немного не то. Тут просто инверсия функции, а я имел ввиду эффект свечения.

В 21.09.2017 в 14:21, Hundmann сказал:

Это немного не то. Тут просто инверсия функции, а я имел ввиду эффект свечения.

Если логотип текстом, то добавить text-shadow: #000 1px 1px 1px вместо opacity (настроить цвет и размер свечения самим), если логотип картинкой - то сложно, т.к. для подобных элементов есть только box-shadow, который добавляет свечение контейнеру, а не картинке внутри. Можно png-шками сделать (но это тип прошлый век) - две картинки логотипа, одна с нужным вам эффектом, сделанным в фотошопе, при наведении менять background с одной картинки на другую с transition.