В связи с переходом на новый движок... возможны сбои в работе! Простите!
Работы производятся прямо сейчас 25-02-2024! 🞨
Меню :
jquery (42)



Blog (1385)
php (328)
js (243)
html (147)
css (131)
html tags (62)
js tag (56)
jquery (42)
text (37)
js method (36)
js date (33)
php array (33)
form html (30)
online (29)
fonts (26)
Показать еще :
link (26)
ruweb.net (25)
foto (22)
atom (20)
php file (20)
forum (19)
svg (18)
hosting (18)
input (18)
php date (17)
board (16)
html book (16)
php time (16)
color (15)
js url (14)
js events (14)
img (14)
info (14)
js time (14)
notepad (13)
select (13)
htaccess (13)
osclass (13)
dw block (12)
php path (12)
keyboard (12)
знак (12)
php img (12)
download (12)
table (12)
form (11)
jsphp (11)
icon (11)
mouse (10)
js delete (10)
yandex (10)
keyframes (10)
hover (9)
chart (9)
dosite (8)
browser (8)
cookie (7)
php url (7)
comment (7)
canvas (6)
list (6)
iframe (6)
adminka (6)
mysql (6)
click (6)
php get (6)
vs code (6)
search (5)
heading (5)
mb (5)
reg.ru (5)
js math (5)
tag a (5)
year (5)
ftp (5)
js id (5)
value (5)
xml (4)
base64 (4)
bbcode (4)
scandir (4)
нок (4)
js form (4)
day (4)
ssl (4)
php var (4)
week (4)
flags (4)
task (4)
month (4)
vk (4)
submit (4)
console (4)
pages (4)
symbols (4)
games (4)
js hash (3)
line (3)
domen (3)
js post (3)
https (3)
captcha (3)
money (3)
куб (3)
ucoz (3)
numbers (3)
js img (3)
padding (3)
tag hr (2)
sitemap (2)
google (2)
рся (2)
prompt (2)
details (2)
counter (2)
height (2)
qr kod (2)
typeof (2)
arrows (2)
js vars (2)
youtube (2)
video (2)
seo (2)
header (1)
windows (1)
speed (1)
cursor (1)
нод (1)
jino (1)
smile (1)
archive (1)
rutube (1)
scroll (1)

Jquery addclass добавление класса

Мы уже говорили о том. Как добавить класс в класс в Js, сегодня поговорим о том, как добавить класс в jquery для этого нам понадобится «addclass»

Примеры использования код:

<script>

$("#example").addClass("NewClass"); //добавит класс NewClass элементу с идентификатором example

$(".example").addClass("NewClass"); //добавит класс NewClass всем элементам с классом example (то есть, у этих элементов станет по меньшей мере два класса: class="example NewClass".

</script>

addclass jquery примеры

Давайте на пример разберем addclass jquery, нам нужен какой-то обьект... давайте сделаем квадрат и стили к нему, например такой:

Код:

<div class="kvadrat_1">kvadrat_1</div>

<style type="text/css">.kvadrat,.kvadrat_1 { background: #ec0909; width: 100px; height: 100px;} .kvadrat.NewClass{color: #ffffff}</style>

Результат:

kvadrat_1
2.

Вторым шагом нам нужно написать скрипт, в котором добавим к уже существующему классу "kvadrat" новый класс "NewClass"

И если вы обратили внимание, то в стилях, есть два квадрата(.kvadrat,.kvadrat_1), это для того, чтобы в первом случае он не менялся... мы использовали ".kvadrat_1", а уже добавлять будем к классу:".kvadrat"

<script>$(".kvadrat").addClass("NewClass");</script>

Мы добавили к классу ".kvadrat" класс "NewClass" и у нас получился новый класс ".kvadrat.NewClass" - см чуть выше стили... у нас изменился цвет текста...

Результат:

kvadrat

addclass jquery примеры

Где могут использовать и зачем addclass jquery нужно, мы например использовали это на другом сайте где требуется показать скрыть блок при нажатии.

3.

Еще один пример использование «addclass jquery» добавление класса!

Давайте возьмем предыдущий квадрат и пусть это будет «kvadrat_2» изменим его позиционирование относительно левого края… добавлением класса NewClass_2

<div class="kvadrat_2">kvadrat_2</div>

<style type="text/css">.NewClass_2{ margin-left: 354px;} .kvadrat_2 { background: #ec0909; width: 100px; height: 100px; color: #ffffff}</style>

<script>$(".kvadrat_2").addClass("NewClass_2");</script>

Результат:

kvadrat_2
Не стесняемся говорить спасибо!
Ещё : dwweb.ru есть здесь:
ruweb
Все статьи авторские, при копироавании активная ссылка обязательна DwWeb.ru! © 2015 - 2024 Контакты. Реклама на сайте Лучший хостинг : RUWEB + помощь по RUWEB
Страница загружена за : 0.014211 секунд. Подробнее