Посещенные ссылки теряют цветную анимацию CSS в Chrome
Я пытаюсь установить цветные анимации по ссылкам. После того, как ссылка была посещена в Chrome, цветовая анимация больше не применяется. Это не относится к другим анимированным стилям (я тестировал цвет фона, размер шрифта и размер шрифта), ни в других браузерах (Firefox, Safari, IE11).
Вот демо:
http://codepen.io/benjarwar/pen/rVJbeR
http://s.codepen.io/benjarwar/debug/rVJbeR
HTML:
<a href='#' target='_blank' class='color'>Color Animation</a>
CSS
a.color,
a.color:visited {
-moz-animation: color-animation 1s ease-in-out infinite;
-webkit-animation: color-animation 1s ease-in-out infinite;
animation: color-animation 1s ease-in-out infinite;
}
@-moz-keyframes color-animation {
0% { color: #f00; }
50% { color: #fc0; }
100% { color: #f00; }
}
@-webkit-keyframes color-animation {
0% { color: #f00; }
50% { color: #fc0; }
100% { color: #f00; }
}
@keyframes color-animation {
0% { color: #f00; }
50% { color: #fc0; }
100% { color: #f00; }
}
Шаги для воспроизведения:
- Перейдите по ссылке выше
- Обратите внимание, что ссылки имеют разные анимации.
- Нажмите одну из ссылок (все указывают на href= "#" )
- Обратите внимание, что ссылка цветной анимации больше не анимируется
- Удалить ссылку из истории браузера и обновить
- Обратите внимание, что анимация возвращается после удаления ссылки из истории
Использование версии Chrome версии 43.0.2357.130 в Mac OS 10.9.5
Ответы
Ответ 1
Я думаю, что это связано с некоторой общей проблемой безопасности/конфиденциальности в прошлом:
Ограничивали свойства CSS, которые можно использовать для стиля посещения ссылки на цвет, цвет фона, границы - * - цвет и контурный цвет и цветные части свойств заливки и хода.
https://hacks.mozilla.org/2010/03/privacy-related-changes-coming-to-css-vistited/
https://blog.mozilla.org/security/2010/03/31/plugging-the-css-history-leak/
Ответ 2
Раньше вы могли использовать анимацию, но теперь большинство браузеров ограничивают использование CSS-стиля при посещении. Разрешены только свойства
- Цвет
- цвет фона
- граница - * - цвет
- контурный цвет и
- цветные части свойств заливки и обводки.
источник
Почему
Раньше люди использовали посещаемый хак, чтобы узнать, какие веб-сайты вы посетили.
http://dbaron.org/mozilla/visited-privacy