jquery odczytanie z pliku css wartości np. width

Mam takie pytanie mam sobie div np div1 i w pliku css ma wartość width : 100px;

I teraz w pliku js.js wykonuje akcje, która na początku ustawia ten div na wartość 0 px i potem go powiększa do wartości która jest w pliku css i teraz bym mógl to zrobić prosto
w ten sposób

          $( "#fiveMain" ).animate({
    width: 100px,
    height: 100px,
    opacity: 0.9

    



  }, 5000 ).css({ visibility: 'visible'});

Ale co w monecie kiedy jest kilka plików css dla różnych roidzielczości wi dla każdej rozdzielczości jest inna wartość.

Z tąd moje pytanie co trzeba zrobić, żeby odczytać wartośc div z pliku css, który jest aktualnie załadowany ?

https://api.jquery.com/css/

jQuery posiada metodę css, którą możesz pobrać aktualną wartość stylu CSS

const $fixeMain = $('#fiveMain');

const currentColor = $fixeMain.css('color');
const currentBoxShadow = $fixeMain.css('box-shadow');
const currentPosition = $fixeMain.css('position');

Ja to wiem ale ta metoda pobiera wartość css szerokośc która am akatualnie ustawioną a nie jaka jest w pliku css

Z tąd moje pytanie co trzeba zrobić, żeby odczytać wartośc div z pliku css, który jest aktualnie załadowany ?

Mam wrażenie, że to XY problem https://en.wikipedia.org/wiki/XY_problem

Czyli, że jakoś tam kombinujesz i pytasz o coś związanego z twoim aktualnym pomysłem na rozwiązanie, zamiast zapytać o prawdziwy problem.

Co chcesz dokładnie osiągnąć? Jaki ma być efekt końcowy tych animacji? Jakiego rodzaju dane chcesz wyciągać z plików CSS?

LukeJL napisał(a):

Z tąd moje pytanie co trzeba zrobić, żeby odczytać wartośc div z pliku css, który jest aktualnie załadowany ?

Mam wrażenie, że to XY problem https://en.wikipedia.org/wiki/XY_problem

Czyli, że jakoś tam kombinujesz i pytasz o coś związanego z twoim aktualnym pomysłem na rozwiązanie, zamiast zapytać o prawdziwy problem.

Co chcesz dokładnie osiągnąć? Jaki ma być efekt końcowy tych animacji? Jakiego rodzaju dane chcesz wyciągać z plików CSS?

Ale co w monecie kiedy jest kilka plików css dla różnych roidzielczości wi dla każdej rozdzielczości jest inna wartość.

No własnie to chodzi o to, że szerokości i wysokości są w pliku css i tych plików będzie kilka, w zalezności od rozdzielczości (będa miały więc inne width i height).

A ja chcę na początku wykonywania kodu jquery ustawić wartość tych divów na 0 i potem one mają wykonac animacje do wartości width i height zgodnie z taką jaka jest w pliku css.

Jeśli chodzi Ci o tego typu animacje to zdecydowanie łatwiej będzie to zrobić w CSS. Głównie dzięki właściwości transform i transition / @keyframes + animation

https://codepen.io/vailjoy/pen/ZLLLYd
https://codepen.io/ZachSaucier/pen/DEoqpj
https://codepen.io/dhbalaji/pen/pENgza
https://codepen.io/vineethtrv/pen/XKKEgM
https://codepen.io/agaroff/pen/aGjgOL

Druga sprawa to nie wiem jak tam przełączasz się miedzy cssami, ale to że dane style mają obowiązywać dla danych rozdzielczości ustawia się używając @media.

Jeszcze może być łatwiej animować min-width zamiast width