Javascript.RU

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

Смена картинок в зависимости от положения курсора мыши
Здравствуйте, уважаемые профи и читатели форума!
Я со всей серьезностью понимаю, что задача не сложная. Но, к сожалению, пока нет времени на изучение азов JavaScript.
Возникла необходимость иметь скрипт, который сможет менять картинки друг на друга в зависимости от положения курсора мыши на странице.
Допустим, можно задать границы координат страницы, в пределах которых на странице будет одна из картинок, когда курсор мыши будет находиться там. За пределами этих границ будут другие границы координат страницы, в пределах которых другая картинка заменит предыдущую. И так далее.
Всего должно быть 8 зон: 4 ограничены размерами квадратной картинки и еще 4 оставшиеся, не вошедшие туда (как на картинке). На все 8 зон 8 разных картинок. Ну еще можно добавить 9ую стандартную картинку, когда курсор мыши находится вне страницы.
Спасибо!
Изображения:
Тип файла: jpg Без имени.jpg (33.1 Кб, 3 просмотров)
Ответить с цитированием
  #2 (permalink)  
Старый 31.05.2011, 17:17
Интересующийся
Отправить личное сообщение для jazzz13 Посмотреть профиль Найти все сообщения от jazzz13
 
Регистрация: 31.05.2011
Сообщений: 25

Здравствуйте.
Нужна верстка которая и будет содержать в себе эти 8 блоков как у Вас не рисунке.
При наведении на каждый блок вызывается событие, которое выставляет нужную картинку в нужное место.

Если еще актуально могу черновик набросать (jQ да?нет?).
Ответить с цитированием
  #3 (permalink)  
Старый 31.05.2011, 19:44
Аватар для antonio_vrn
Новичок на форуме
Отправить личное сообщение для antonio_vrn Посмотреть профиль Найти все сообщения от antonio_vrn
 
Регистрация: 30.05.2011
Сообщений: 2

Как Вам удобно, лишь бы было понятно, чтобы разобраться и использовать его в дальнейшем. Сам не далек от программирования (PHP, Delphi).
Спасибо.
Ответить с цитированием
  #4 (permalink)  
Старый 31.05.2011, 22:07
Интересующийся
Отправить личное сообщение для jazzz13 Посмотреть профиль Найти все сообщения от jazzz13
 
Регистрация: 31.05.2011
Сообщений: 25

Надеюсь с версткой все понятно.
У каждого блока должен быть атрибут (например name) которые будет содержать название картинки. И у всех одинаковый класс: "blockclass".

Так как Вы не знакомы с js до подключим jQuery и будет проще.

var blocks = $('.blockclass'); // находим все блоки нашего класса
var img = $('#img'); // находим картинку по ИД = #img
blocks.mouseover(function(){ //вешаем функцию на наведение мыши
   new_src = $(this).attr('name');  // получаем новый путь из name текущего блока
   img.attr('src',new_src); // заменяем старый на новый
});
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Необходима помощь! Остановка карусели при наведении курсора мыши. DAZ jQuery 5 11.05.2018 11:49
Смена положения курсора в текстовой строке trikadin Элементы интерфейса 4 12.11.2010 02:00
проверка положения мыши Yellow79 Javascript под браузер 6 11.05.2010 22:04
смена положения картинок yadino Общие вопросы Javascript 7 18.03.2010 23:46
Помогите создать скрипт замены картинок при наведении курсора. SantaS Я не знаю javascript 3 05.06.2009 12:59