Animatie css imagine din stanga in dreapta

#1
bunicu9

Posted 03 December 2020 - 21:43

Member

Grup: Members
Posts: 253
Înscris: 14.07.2013

Am o imagine cu un sarpe si vreau sa se plimbe din stanga in dreapta in css

Am facut asta dar imi mareste dimensiunea paginii in dreapta cu aprox. 10%

<!DOCTYPE html>
<html>
<head>
<style>
.snake {
  width: 150px;
  height: 150px;
  position: relative;
  animation: mymove 6s infinite;
  animation-timing-function: linear;
}
@keyframes mymove {
  from {left: -100px;}
  to {left: 100%;}
}
</style>
</head>
<body>

<div class="snake">
<img src="https://cdn.pixabay.com/photo/2013/07/12/12/15/snake-145409_960_720.png" class="img-fluid" alt="Responsive image" height="60px">
</div>

Daca as pune position: fixed; as rezolva problema dar m-ar urmari peste tot.
Ce as putea face?

Back to top

#2
Bogdan__26

Posted 03 December 2020 - 22:27

Junior Member

Grup: Junior Members
Posts: 39
Înscris: 26.01.2016

Pune la body overflow-x: hidden;

Back to top

#3
bunicu9

Posted 04 December 2020 - 19:36

Member

Grup: Members
Posts: 253
Înscris: 14.07.2013

Bogdan__26, on 03 decembrie 2020 - 22:27, said:

Pune la body overflow-x: hidden;

Pe pc functioneaza in orice rezolutie dar pe telefon tot asa face

Back to top

#4
coniac

Posted 05 December 2020 - 11:09

Member

Grup: Members
Posts: 497
Înscris: 17.12.2019

to {left: calc(100% - 150px);}
scazi width of snake

Back to top

Anunturi

Neurochirurgie minim invazivă

"Primum non nocere" este ideea ce a deschis drumul medicinei spre minim invaziv.

Avansul tehnologic extraordinar din ultimele decenii a permis dezvoltarea tuturor domeniilor medicinei. Microscopul operator, neuronavigația, tehnicile anestezice avansate permit intervenții chirurgicale tot mai precise, tot mai sigure. Neurochirurgia minim invazivă, sau prin "gaura cheii", oferă pacienților posibilitatea de a se opera cu riscuri minime, fie ele neurologice, infecțioase, medicale sau estetice.

www.neurohope.ro

Animatie css imagine din stanga in dreapta

#1 bunicu9 Posted 03 December 2020 - 21:43

#2 Bogdan__26 Posted 03 December 2020 - 22:27

#3 bunicu9 Posted 04 December 2020 - 19:36

#4 coniac Posted 05 December 2020 - 11:09

Anunturi

▶ 0 user(s) are reading this topic

Sign In

#1
bunicu9

Posted 03 December 2020 - 21:43

#2
Bogdan__26

Posted 03 December 2020 - 22:27

#3
bunicu9

Posted 04 December 2020 - 19:36

#4
coniac

Posted 05 December 2020 - 11:09