Jak wyłączyć animację po przeładowaniu strony.

Question

Cześć, mam pytanie czy da radę jakoś usunąć animację po przeładowaniu strony?

Używam transition i :hover po najechaiu na element. I gdy przeładuję na nowo stronę to background-position ustawia się na docelowe.

.basket
{
    transition: 1s;
    background-position: -250px 0px;
}

/basket:hover
{
    background-position: -260px 0px;
}

 

Comments

Opisz proszę dokładnie w czym jest problem. Chcesz żeby efekt z hovera był widoczny po przeładowaniu strony? Musiałbyś gdzieś zapisać taką informację (ciastko, storage, albo wyślij to do backendu i niech on ustawi odpowiednią klasę na element w HTML - tutaj pewnie przydała by się sesja użytkownika), żeby po przeładowaniu móc to ustawić.

---

"Animacja" wywoływana przez :hover ("najechanie myszką" na element na stronie), też "wraca" na nowo do ustawień, które są "pierwotne" ("zjechanie myszką" z elementu na stronie), więc doprecyzuj swoje pytanie, proszę. 

---

Już rozwiązałem problem, po prostu transition powinno być w :hover. Nie wiem dlaczego wpisałem to wyżej.

---

@ShockWave, przepraszam Ciebie bardzo, ale co Twoje rozwiązanie

Już rozwiązałem problem, po prostu transition powinno być w :hover

ma wspólnego z (???)

Cześć, mam pytanie czy da radę jakoś usunąć animację po przeładowaniu strony?

bo poza efektem "skakania" animacji nie widzę różnicy (łącznie z przeładowaniem strony).

 

<div class="basket1"></div>
<div class="basket2"></div>

.basket1, .basket2 {
  width: 20vw;
  height: 20vh;
  background-image:  url(http://lorempixel.com/1400/1400/abstract/1);
  margin: 1em 0;
}

.basket1 {
  transition: 1s;
  background-position: -250px 0px;
}
.basket1:hover {
  background-position: -260px 0px;
}

.basket2 {
  background-position: -250px 0px;
}
.basket2:hover {
  transition: 1s;
  background-position: -260px 0px;
}

Czy aby na pewno o to chodziło?  

transition css służy bardziej do uzyskania "płynnego" przejścia z jednego stanu(ów) do drugiego w css.