• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Animacja css na obrazku boostrap .

VPS Starter Arubacloud
0 głosów
327 wizyt
pytanie zadane 21 sierpnia 2017 w HTML i CSS przez Bogusław Witek Początkujący (420 p.)
Witam mam obrazek któremu dałem klase .img-responsive klasa ta zawiera: max-width: 100%, height: auto,  display:block dzięki temu obrazek się ładnie skaluje na każdej rozdzielczości. Wcześniej miałem animacje w css która polega na tym że po najechaniu element który ma opacity: 0; oraz background-color: #424A4A; zmienia się na opacity: 0.9; działo się to na całym obrazu . Element wcześniej ma position: relative; a element z animacją ma position: absolute;. Jak zrobić aby wielkość elementu który ma animacje podążał za wielkością obrazka w każdej rozdzielczości. Bo aktualnie na małej rozdzielczości jest ok a na większej po najechaniu background-color: #424A4A; wystaje poza obrazek.
komentarz 21 sierpnia 2017 przez Bogusław Witek Początkujący (420 p.)
krócej mówiąc element wcześniej nie może mieć stałej wysokości i szerokości a animacja ma być na całym obrazku

1 odpowiedź

0 głosów
odpowiedź 21 sierpnia 2017 przez Bogusław Witek Początkujący (420 p.)
wybrane 22 sierpnia 2017 przez Bogusław Witek
 
Najlepsza
Tak to teraz wygląda:

http://i.imgur.com/kanaHpN.png
komentarz 21 sierpnia 2017 przez Maciej Woźnica Użytkownik (520 p.)
Cześć,

Używasz właściwości max-width:100% więc obrazek na szerszych rozdzielczościach może mieć mniejszą szerokość niż 100%. Spróbuj użyć właściwości width: 100%

Maciek
komentarz 21 sierpnia 2017 przez Bogusław Witek Początkujący (420 p.)
edycja 21 sierpnia 2017 przez Bogusław Witek
Niestety i tak i tak się to jakoś miesza masz tu wersje live: ..... przerób sobie przez zbadaj element. Jak ci się uda do tego dojść to napisz bo nie mogę sobie z tym poradzić głowie i głowie i nie wiem.

A i właśnie było ustawione width a nie max-width no ale mniejsza o to bo nie działa i tak i tak.

edit:
usunąłem link sam sobie poradziłem z problemem , już wszystko działa :D
komentarz 21 sierpnia 2017 przez Bogusław Witek Początkujący (420 p.)
A i bardzo proszę o wyrozumiałość w kodzie może być masa błędów aktualnie się tym bawię i próbuje czegoś nauczyć. Ale mimo wszystko jestem bardzo początkujący .

Podobne pytania

0 głosów
2 odpowiedzi 546 wizyt
pytanie zadane 2 maja 2017 w HTML i CSS przez UltraSF Stary wyjadacz (11,740 p.)
0 głosów
2 odpowiedzi 664 wizyt
pytanie zadane 24 stycznia 2017 w HTML i CSS przez R.orlinski Mądrala (5,490 p.)
0 głosów
0 odpowiedzi 96 wizyt
pytanie zadane 22 marca 2017 w JavaScript przez LCPGM Obywatel (1,550 p.)

92,454 zapytań

141,262 odpowiedzi

319,089 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...