Highlight кнопка после нажатия javascript

Question

Я пытаюсь сделать простую галерею изображений с html/css и немного javascript. Все работает и работает, но одна функция.

Я хочу, чтобы, когда я открываю index.html «Все» будет уже выделен мой пользовательский стиль, и если толкнул на другую кнопку подсветки будет идти к этой конкретной кнопки.

HTML кнопки выглядит следующим образом

<input type='button' value='Design' class="cat-itiem" id='filterDesign'> 

редактирование: Я закончил с использованием OnResolve's method и он работал нормально (даже для тех, кто не знает JS) Спасибо всем за помощь! :)

Answer 1

Я создал экзамен с jsfiddle для вас с простым jQuery. Вы можете увидеть каждый аспект (разметка, css и jquery).

http://jsfiddle.net/p5ZUv/7/

Answer 2

Если предположить, что выделенный класс называется activeButton, вы можете сделать следующее с JQuery

$(function() { 
    $(".cat-itemem").click(function() { 
     $(".cat-itemem").removeClass('activeButton'); 
     $(this).addClass('activeButton'); 
    } 
}) 

Answer 3

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

HTML:

<input type='button' value='All' class="cat-itiem highlighted" id='filterAll'> 
    <input type='button' value='Design' class="cat-itiem" id='filterDesign'> 
    <input type='button' value='Logo' class="cat-itiem" id='filterLogo'> 
<input type='button' value='Photography' class="cat-itiem" id='filterPhotography'> 

CSS (Добавить ваше)

.cat-itiem{} 

.highlighted{background:green} 

JS (Jquery используется)

$('.cat-itiem').click(function(){$('.cat-itiem').removeClass('highlighted'); $(this).addClass('highlighted')}