Пыха всегда с тобой

Добро пожаловать на Пыху!

Логин:
Пароль:
 

Нет прописки? Зарегистрируйся!

Новости

Пыха информатор 3.1
Еще более удобное оповещение о флуде!

Краснодарское время: 25 Май, 2012, 09:15:17

Страниц: [1] 2
Печать
Автор Тема: Увеличение при наведении курсора  (Прочитано 873 раз)
0 Пользователей и 1 Гость смотрят эту тему.
AdmBuxonly    ↓ 
08 Июнь, 2011, 01:14:01
НЕ ХУЕТА! ХУЕТА!


Карма: -1
Сообщений: 369
Сила слова: -0.27

Привет! Пытаюсь сделать так, чтобы при наведении курсора мыши на DIV он уменьшался в ширине и высоте а при отведении курсора мыши обратно возвращался в исходный размер. Вот что делал я:
 
Javascript
// Скрипты, обрабатывающие теги документа index.php
var adc = $('#block').width(500).height(400);
adc.css('border','3px solid #ff0000');
adc.css('background-color','#ccc');
adc.css('margin','25px');
adc.css('cursor','pointer');
// Эта функция обрабатывает события для блока див
function blockOver (result) {
    if (result) {
        adc.width(200);
    }
    else adc.width(500);
}
}); // Это строка завершает построение DOM дерева
 

а вот и сам див:
 
HTML
<div id="block" onmouseover="blockOver(true)" onmouseout="blockOver(false)">Это блочная хрень</div>

Но ни чего не происходит. Подскажите что делаю не так... я начинающий в JQ и JS. В общем функция не срабатывает.
Записан
Status    ↓ 
08 Июнь, 2011, 03:01:25 , спустя 1 час 47 минут 24 секунды
НЕ ХУЕТА! ХУЕТА!

Редкостная сволочь
Группа: Джедаи

Карма: 57
Сообщений: 1447
Сила слова: 3.94

Блин опять про див, а я то думал что это увеличивается при наведении курсора:D
Записан

Заткнись говно, я воевал!
Stasovsky    ↓ 
08 Июнь, 2011, 03:06:15 , спустя 4 минуты 50 секунд
НЕ ХУЕТА! ХУЕТА!

Сенсей XD
Группа: Джедаи

Карма: 54
Сообщений: 3653
Сила слова: 1.48

CSS
div { width:200px; height:200px; }
div:hover { width:500px; height:500px; }
и не еби себе мозг
Записан
KaFe    ↓ 
08 Июнь, 2011, 04:30:19 , спустя 1 час 24 минуты 4 секунды
НЕ ХУЕТА! ХУЕТА!

Группа: Сраный Тролль

Карма: -13346
Сообщений: 1727
Сила слова: -772.79


CSS
div { width:200px; height:200px; }
div:hover { width:500px; height:500px; }
и не еби себе мозг
:D
Записан

AdmBuxonly    ↓ 
08 Июнь, 2011, 06:52:27 , спустя 2 часа 22 минуты 8 секунд
НЕ ХУЕТА! ХУЕТА!


Карма: -1
Сообщений: 369
Сила слова: -0.27

Чет я ни че не понял)
Записан
Stasovsky    ↓ 
08 Июнь, 2011, 07:38:04 , спустя 45 минут 37 секунд
НЕ ХУЕТА! ХУЕТА!

Сенсей XD
Группа: Джедаи

Карма: 54
Сообщений: 3653
Сила слова: 1.48

Чет я ни че не понял)
это цсс, блеать! при наведении блок увеличивается)) нафига на такую простецку задачу выносить себе мозг скриптами?)
 
Javascript
$('.block')
    .css({
        width: 500,
        height: 400,
        border: '3px solid #ff0000',
        backgroundColor: '#ccc',
        margin: 25,
        cursor: 'pointer'
    })
    .mouseover(function() {
        $(this).width(200);
    })
    .mouseout(function() {
        $(this).width(500);
     });
Записан
AdmBuxonly    ↓ 
08 Июнь, 2011, 09:41:20 , спустя 2 часа 3 минуты 16 секунд
НЕ ХУЕТА! ХУЕТА!


Карма: -1
Сообщений: 369
Сила слова: -0.27

Javascript
var topMenuHomeAHover = $('.home a:hover').height(40);
topMenuHomeAHover.css('color','#fff');

А вот так ссылки можно оформлять? Или тоже через моусовер? Потому что у меня такая запись для ссылки не работает(((
Записан
Stasovsky    ↓ 
08 Июнь, 2011, 09:46:57 , спустя 5 минут 37 секунд
НЕ ХУЕТА! ХУЕТА!

Сенсей XD
Группа: Джедаи

Карма: 54
Сообщений: 3653
Сила слова: 1.48

раз не работает, значит нельзя -_-
че те не травятся .mouseover(), .mouseenter() и .hover()?
Записан
AdmBuxonly    ↓ 
08 Июнь, 2011, 09:50:27 , спустя 3 минуты 30 секунд
НЕ ХУЕТА! ХУЕТА!


Карма: -1
Сообщений: 369
Сила слова: -0.27


раз не работает, значит нельзя -_-
че те не травятся .mouseover(), .mouseenter() и .hover()?

Я не не очень хорошо еще понимаю принцип их работы... а про .hover только сейчас узнал. Я вообще вот так сейчас верстаю (тренируюсь, вырабатываю автоматизм, чтобы лучше запомнить, делаю тестовый шаблон):
 
Javascript
// TABLE GLOBAL
var table = $('.global');
table.width(902).height(400);
table.css('background-color','#fff')
table.css('border','0')
table.css('margin','0 auto');
table.css('background-image','url(images/bg.gif)');
table.css('background-position','center');
table.css('background-repeat','repeat-y');
// END TABLE GLOBAL

вот так вот... и пока больше ни как не умею.. читаю понемногу но это все не то...  я в принципе с примеров нормально понимаю... но опять же правила записи того же самого background-color отличаются в двух случаях по разному.
Записан
Stasovsky    ↓ 
08 Июнь, 2011, 10:10:22 , спустя 19 минут 55 секунд
НЕ ХУЕТА! ХУЕТА!

Сенсей XD
Группа: Джедаи

Карма: 54
Сообщений: 3653
Сила слова: 1.48

во-первых, кури маны...
 
во-вторых, не страдай такой хуйней
Javascript
table.width(902).height(400);
если для этого есть .css()
Javascript
table.css({width:902, height:400})

в-третьих, нафига постоянно обращать к одной и той же фенкции?
Javascript
table.css('background-color','#fff')
table.css('border','0')
table.css('margin','0 auto');
у тебя получается "чувак, дай сигарету; дай зажигалку; дай денег;..."
вместо этого в функцию кидай объект
Javascript
table.css({
    backgroundColor: '#fff',
    border: 0,
    margin: '0 auto'
});
и получится "чувак, дай сигарету, зажигалку, денег..."
 
в-четвертых, нахуя числа в строки пихаешь? не критично конечно, но с числами ему проще работаеццо
 
в-пятых, в цсс есть background-image, а в жс есть backgroundImage
CSS                            JS        
background-position       backgroundPosition
background-repeat         backgroundRepeat
margin-top                    marginTop
и так далее
 
в-шестых, учи цсс, блеать!!))) вместо
CSS
background-image: url(images/bg.gif);
background-position: center;
background-repeat: repeat-y;
нормальные люди пишут
CSS
bacground:#fff url('image.jpg') 50% 50% no-repeat;
Записан
AdmBuxonly    ↓ 
08 Июнь, 2011, 10:16:50 , спустя 6 минут 28 секунд
НЕ ХУЕТА! ХУЕТА!


Карма: -1
Сообщений: 369
Сила слова: -0.27

Спасибо за такой ответ клевый! Ухожу в запой, дабы нужно все осознать и и обработать... все гораздо проще чем я думал... завтра весь файл перепишу по новому, а это 87 строк или 227кб... интересно как завтра будут цифры...
Записан
truth4oll    ↓ 
09 Июнь, 2011, 01:08:08 , спустя 2 часа 51 минуту 18 секунд
НЕ ХУЕТА! ХУЕТА!

Группа: Адекваты

Карма: 15
Сообщений: 471
Сила слова: 3.18

87 строк = 227 кб? данунахуй)
Записан

План прост - потому красив
AdmBuxonly    ↓ 
09 Июнь, 2011, 04:51:29 , спустя 3 часа 43 минуты 21 секунду
НЕ ХУЕТА! ХУЕТА!


Карма: -1
Сообщений: 369
Сила слова: -0.27


87 строк = 227 кб? данунахуй)

ты прав.. я не туда посмотрел....(( там размер файла 0B.... чет пишу пишу а он не увеличивается...
Спустя 1 минуту 10 секунд добавил
а нет вру 4 кб..
Записан
AdmBuxonly    ↓ 
12 Июнь, 2011, 04:19:00 , спустя 3 дня 11 часов 27 минут 31 секунду
НЕ ХУЕТА! ХУЕТА!


Карма: -1
Сообщений: 369
Сила слова: -0.27

Ребят не стал создавать новую тему в это продолжу один и тот же вопрос мучает. Не пойму принцип работы растолкуйте кто может:
 
Javascript
<link src="jquery.js" type="text/javascript">
  <title>Изучение HTML</title>
<script type="text/javascript">
$(document).ready(function() {
function linkHover() {
var Link = $('ul li a');
    Link.css({
    color: '#cc0000'
    })
}
}
</script>
</head>
<body>
<ul>
    <li><a href="#" onMouseOver="javascript: linkHover();" >Ntrcn</a></li>
<ul>
</body>
</html>

Надо чтобы при наведении курсора на ссылку она менялась... что должно передаваться в функцию? то что выше код не пашет...
Записан
truth4oll    ↓ 
12 Июнь, 2011, 04:33:54 , спустя 14 минут 54 секунды
НЕ ХУЕТА! ХУЕТА!

Группа: Адекваты

Карма: 15
Сообщений: 471
Сила слова: 3.18

this можно добавить
Записан

План прост - потому красив
Страниц: [1] 2
Печать
 

Перейти в:  

Этот топик скрыли: md5, adw0rd, Frozzeg, mario