Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 29.08.2015, 23:37
Новичок на форуме
Отправить личное сообщение для Сергей_FE Посмотреть профиль Найти все сообщения от Сергей_FE
 
Регистрация: 29.08.2015
Сообщений: 1

Нужно перебрать элементы добавить их в массив и добавить к элементам класс
Есть html:
<div class="col-xs-12 col-sm-12 col-md-5" id="social-icons">
				<a href=""><img src="img/facebook.png" alt="facebook"></a>
				<a href=""><img src="img/linkedin.png" alt="linkedin"></a>
				<a href=""><img src="img/twitter.png" alt="twitter"></a>
				<a href=""><img src="img/pinterest.png" alt="pinterest"></a>
				<a href=""><img src="img/dribbble.png" alt="dribbble"></a>
				<a href=""><img src="img/google-plus.png" alt="google-plus"></a>
			</div>


Нужно с помощью jQuery и css класса, чтобы при наведении на каждую картинку, допустим она немного увеличивалась в размере.

У меня есть такой код, но он не работает
$(document).ready(function(){
    $('#social-icons a img').hover(function(){

         var myArray =[];

         $('#social-icons img').each( function() {
             myArray.push($(this.id).addClass( "ic" );

         })
    });  
});
Ответить с цитированием
  #2 (permalink)  
Старый 30.08.2015, 02:33
Аватар для Lemme
Профессор
Отправить личное сообщение для Lemme Посмотреть профиль Найти все сообщения от Lemme
 
Регистрация: 15.07.2015
Сообщений: 511

$('#social-icons').on('mouseover', 'img', function() {
	$(this).addClass('ic');
});

?
Ответить с цитированием
  #3 (permalink)  
Старый 30.08.2015, 12:39
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 17.12.2011
Сообщений: 4,415

Сергей_FE,


$(document).ready(function(){
    $('#social-icons a img').hover(function(){
         var elementsArray =  $('#social-icons a img');

        elementsArray.addClass("ic");
    });  
});
__________________
Цитата:
Если ограничения и условия описываются как "коробка", то хитрость в том что бы найти именно коробку... Не думайте о чем то глобальном - найдите коробку.
Ответить с цитированием
  #4 (permalink)  
Старый 30.08.2015, 12:58
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,067

css на вас нету!
Ответить с цитированием
  #5 (permalink)  
Старый 30.08.2015, 13:27
Аватар для cyber
I am Student
Отправить личное сообщение для cyber Посмотреть профиль Найти все сообщения от cyber
 
Регистрация: 17.12.2011
Сообщений: 4,415

рони,
какой вопрос такой и ответ))
__________________
Цитата:
Если ограничения и условия описываются как "коробка", то хитрость в том что бы найти именно коробку... Не думайте о чем то глобальном - найдите коробку.
Ответить с цитированием
  #6 (permalink)  
Старый 30.08.2015, 14:07
Аватар для EmperioAf
Профессор
Отправить личное сообщение для EmperioAf Посмотреть профиль Найти все сообщения от EmperioAf
 
Регистрация: 15.01.2015
Сообщений: 622

Сообщение от Сергей_FE
чтобы при наведении на каждую картинку, допустим она немного увеличивалась в размере.
Это делается с помощью css:

http://htmlbook.ru/css/hover
http://htmlbook.ru/css/width
http://htmlbook.ru/css/height
Ответить с цитированием
  #7 (permalink)  
Старый 30.08.2015, 16:19
Аватар для Lemme
Профессор
Отправить личное сообщение для Lemme Посмотреть профиль Найти все сообщения от Lemme
 
Регистрация: 15.07.2015
Сообщений: 511

EmperioAf, а начиная с ie9, через transform
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
		div{
			width: 50px;
			height: 50px;
			background: #123;
		}
		div:hover{
			transform:scale(1.25);
		}
	</style>
</head>
<body>
	<div></div>
</body>
</html>
Ответить с цитированием
  #8 (permalink)  
Старый 30.08.2015, 16:44
Аватар для EmperioAf
Профессор
Отправить личное сообщение для EmperioAf Посмотреть профиль Найти все сообщения от EmperioAf
 
Регистрация: 15.01.2015
Сообщений: 622

Сообщение от Lemme
а начиная с ie9, через transform
я всегда думал, что transform для браузера более затратен чем более ранние аналоги(для translate и scale). Разве нет?
Ответить с цитированием
  #9 (permalink)  
Старый 30.08.2015, 17:06
Аватар для Lemme
Профессор
Отправить личное сообщение для Lemme Посмотреть профиль Найти все сообщения от Lemme
 
Регистрация: 15.07.2015
Сообщений: 511

EmperioAf, не заморачивался над подобным вопросом, но мне кажется, что он делать тоже самое, что и width, height, только внутри своего движка (или как то так).

width: 50px;
height: 50px;
transform: scale(1.25);
=
width = width * 1.25
height = height * 1.25

только мы этого не видим. Но это лишь предположение )
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Добавить / удалить класс кликом fabrique Общие вопросы Javascript 4 03.09.2014 04:43
Добавить класс в другой класс jQuery skillful jQuery 9 09.02.2014 17:40
Добавить класс изображениям Kerovan Общие вопросы Javascript 13 21.08.2013 01:29
Добавить в набор новые элементы a22432 jQuery 1 28.08.2012 14:34
Добавить элементы формы Katik Элементы интерфейса 1 02.03.2012 11:09