Вечер добрый!

Сейчас изучаю программирование и столкнулся с тем что одни и теже вещи можно делать разными способами. Подскажите в каких случаях лучше применить css, а в каких JS? Например

    $('#buttom_add_otziv').hover(
        function(){
            $('#buttom_add_otziv').animate({marginTop:'+=1px',
                                            marginLeft:'+=1px',
                                            opacity:'0.9'},10);
        },
        function(){
            $('#buttom_add_otziv').animate({marginTop:'-=1px',
                                            marginLeft:'-=1px',
                                            opacity:'1.0'},10);
        }

мне кажется что это то же самое, только без указания времени.

#buttom_add_otziv:hover{
marginTop: 1px;
marginLeft: 1px;
opacity: 0.9;
}

А что гадать-то? Всё просто Если у тебя стиль устанавливается один раз, то тогда только CSS. Если же ты его меняешь в процессе работы, то тогда JS; но изначальное состояние все равно через CSS надо установить.

Логика простая: минимум действий, минимум кода.

_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)

Всё что можно сделать через css, нужно делать только через css. JS применять только там, где без него не обойтись.

Понял! Sergeiss, killer8080, спасибо за объяснения!

PS. Я отвечал на вопрос в заголовке и в первом предложении, не сильно глядя в код.... А в коде у тебя разные вещи. jQuery анимация в первом случае и жесткое изменение стиля во втором случае.
Анимацию надо использовать тогда, когда хочешь красивый эффект получить. А hover - когда просто поменять надо, когда не важно, что "скачком" изменится состояние.


_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)

Наверно пример неудачный, надо было вместо

animate

использовать

css

. Или это все равно бы разные вещи были?

animate() выполняет изменения в течение указанного времени.
css() (функция jQuery) изменяет css, однократно, мгновенно.
hover() изменяет состояние объекта на то время, когда над ним находится мышь. Мышь убрал - состояние опять изменилось, до следующего подхода мыши.


PS. http://api.jquery.com - вот сюда заглядывай иногда...

_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)

Все ясно Так и буду делать Еще раз спасибо.

Invis1ble, как мне кажется то же самое я сделал в 10 строках JS

function text() {
    $('.l1').animate({ opacity:'0'},1000,
        function() {
            $('.l2').animate({opacity:'0'},1000,
                function() {
                    $('.l3').animate({opacity:'0'},1000);
                }
            );
        }
    );
};

Исходя из ваших ответов я понял что CSS в приоритете.
Но на CSS это 80 строк а на JS 10. Почему CSS в приоритете? Быстрее обрабатывается?

Reh
1. При отключении в браузере JS, CSS продолжает работать.
2. Хороший тон програмирования - разделять логику (скрипт) от вывода (шаблон)
При использовании JS для изменения шаблона, мы удручаем дизайнеров-верстальщиков, не все из которых знают JS
3. При изменении стилей сторонним разработчиком (ну или сам через год), в инспекторе HTML (Firebug etc.) мы видим html и css, и если шаблон был жестко очумелен JS, то не просто выискивать баги или вносить изменения.
Пример:

<div id='red_div' style='color: #ff0000'>Я красный ДИВ</div>

и где-то в аналах кода есть такое:

$( document ).ready(function() {
   $('#red_div').css('color', '#00ff00'); // Красный див теперь зеленый
});

И у дизайнера взрывается мозг... ВОТ ЖЕ, В СТИЛЯХ НАПИСАНО, ЧТО ОН КРАСНЫЙ!!! НУ ПОЧЕМУ ЖЕ ОН ЗЕЛЕНЫЙ???

_____________
[продано копирайтерам]

Invis1ble, AllesKlar - спасибо!

SergeySA, ссылки неверные... По первой ничего не показывает, по второй показывает то, что заявлено по первой. А прогресс-бара не видно нигде вообще.

_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)