Как оформить стиль в JS?

Question

[Юра]

Привет, вопрос думаю простой, но для меня самоучки не понятный, как оформить стиль в JS?

Есть небольшой код который при скролле добавляет тень для фиксированного блока, нужно для этого же блока добавить нижний бордер и бэграуд, подскажите как?

<!-- Фиксированная тень -->
<script type="text/javascript">
$(function(){
     $(window).scroll(function() {
     var top = $(document).scrollTop();
     if (top < 1) $(".topblock").css("box-shadow","none");
     else $(".topblock").css("box-shadow","0 0 5px rgba(0,0,0,0.5)" сюда нужно добавит border-bottom:1px solid #DEDEDE; background:#FFFFFF url(../background/body-shum.png););
     });
});
</script>

Comments

[Данил Разумков]

Не нужно спамить вопрос. У большинства НОЧЬ и люди спят!

[Сергей Герасимов]

Передайте объект в метод css:
{
"background-color": "yellow",
"font-weight": "bolder"
}

[Юра]

Данил Разумков, Насчёт спама, так у меня ошибка страницы была, потому пробовал несколько раз отправить.

Answer 1

[Юра]

Позже разобрался сам и сразу забыл о вопросе, выкладываю, может кому понадобится

<!-- Фиксированная тень -->
<script type='text/javascript'>
$(function(){
     $(window).scroll(function() {
     var top = $(document).scrollTop();
     if (top < 1) $('.topblock').css({'box-shadow':'none','background':'rgba(255,255,255,0.0)'});
     else $('.topblock').css({'box-shadow':'0 0 2px rgba(0,0,0,0.5)','background':'rgba(255,255,255,0.9)'});
     });
});
</script>

Здесь без бордера, но по этой же аналогии можно и бордер вставить, хотя с тенью он уже лишний.

Answer 2

[Никита Кургин]

Вообще - плохая практика, используйте триггеры классов addClass, removeClass, toggleClass. Что если потребуется сменить цвет тени, например, - не лезть же в js каждый раз.

Comments

[Юра]

addClass, removeClass, toggleClass я не знаю языка JS вообще, потому мне эти команды не знакомы

Answer 3

[Данил Разумков]

Передавайте в .css объект.

else $(".topblock").css({
 box-shadow: '0 0 5px rgba(0,0,0,0.5'), 
 border-bottom: '1px solid #DEDEDE', 
 border-bottom: '', 
 background: '#FFFFFF' //и.т.д.  - запятую не забудьте, если дальше добавлять будете ;)
});

Если не работает, попробуйте кавычки убрать

Comments

[Юра]

Не работает, пробовал и кавычки убрать и добавить ничего нет, даже тени нет теперь.

И почему вас пустой класс border-bottom: '', а здесь я думаю вы ошиблись и не в том месте кавычку поставили box-shadow: '0 0 5px rgba(0,0,0,0.5'), наверно надо за скобкой, пробовал исправить и всё равно вообще ничего не происходит.