Анимация, запущенная при загрузке страницы

У меня возникла проблема с css Переходы стрельба по загрузке страницы. В основном возникла проблема с причудливыми ссылками с пользовательским фоном, снижающимся сверху (начальная позиция) при загрузке страницы. Вы можете увидеть пример here.Анимация, запущенная при загрузке страницы

Эти проблемы возникают только при наличии обоих вход и а теги на странице, так что если мы удалим входной все будет просто отлично. Другой способ решить эту проблему - не использовать внешний файл css: он отлично работает с jsbin, но на самом деле это не помогает, потому что я хочу понять, почему это могло когда-либо происходить.

У меня есть следующий код:

HTML:

<head> 
    <link rel="stylesheet" type="text/css" href="signin.css"> 
    <title>Dobrotech</title> 
</head> 
<body> 
    <input type="password" name="password" required=""/> 
    <a href="">forgot password?</a> 
</body>

CSS:

a{ 
    padding: 0 0 5px 0; 
    background: url(/dobro.tech/images/link.jpg) repeat-x bottom; 
    background-size: 70% 5px; 
    text-decoration: none; 
} 

a:hover { 
    background: url(/dobro.tech/images/activelink.jpg) repeat-x bottom; 
    background-size: 70% 12px; 
} 

a { 
    transition: background-size 0.5s ease-in, background 0.5s ease-in; 
} 

a:hover { 
    transition: background-size 0.1s linear, background 0.1s linear; 
}

UPDATE: Я решил переделать эту ссылку эффект, используя :: до того pseudoclass и проблема исчезла, но я все же хочу выяснить, в чем причина взаимодействия ссылок и исходных данных, что странно

источник

2017-02-22 Forgetable

попробовать это

a{ 
 
padding: 0 0 5px 0; 
 
background: url(dobro.tech/images/link.jpg) repeat-x bottom; 
 
background-size: 70% 5px; 
 
text-decoration: none; 
 
} 
 

 
a:hover { 
 
background: url(dobro.tech/images/activelink.jpg) repeat-x bottom; 
 
background-size: 70% 12px; 
 
}

я удалить первый / из фона URL

download my sample

источник

2017-02-22 05:43:44

Спасибо за ответ, но это не работает для меня. параметр /dobro.tech равен C: /dobro.tech. Даже внешние ссылки на img like [this] (https://pp.vk.me/c638630/v638630595/257aa/NivvXatQk-k.jpg) не помогут. – Forgetable

Анимация, запущенная при загрузке страницы

ответ

Смежные вопросы