PHP.SU
Программирование на PHP, MySQL и другие веб-технологии PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Пользователи Пользователи


 Страниц (2): [1] 2 »   

> Без описания
Поиск в теме | Версия для печати
GFox
Отправлено: 09 Марта, 2010 - 15:30:06
Post Id


Новичок


Покинул форум
Сообщений всего: 35
Дата рег-ции: Март 2010  






Здравствуйте, уважаемые знатоки .
Подскажите, пожалуйста, как сделать так, что бы по умолчанию была одна рамка картинки а при нажатии на неё рамка менялась .
Есть одна картинка (карта), она служит фоном все таблички, а у каждой ячейки это таблички свой фон (картинка с прозрачной серединой - рамка), мне нужно поменять её при нажатии на неё на другую, что бы было видно, в какой ячейке таблицы ты находишься.
вот карта:
http://456.hx0.ru/realtyg.php?g=48
 
 Top
Djin_dj
Отправлено: 09 Марта, 2010 - 16:11:25
Post Id



Member


Покинул форум
Сообщений всего: 167
Дата рег-ции: Июнь 2008  
Откуда: Россия






 Если карта нарисована div,img или table
то абсолютно нет проблем
используем jquery
$('div|img|td#id').css('border','1px solid #FF0000');
и на этом как бы все
Выделит рамкой вокруг если надо подменять картинку то в принципе тажа песня
В случае backgound-image
аналогично вышенаписанному
если это <img> то $('img#id').attr('src',path);

Вариантов много надо понимать чего надо конкретно
 
 Top
GFox
Отправлено: 09 Марта, 2010 - 16:24:00
Post Id


Новичок


Покинул форум
Сообщений всего: 35
Дата рег-ции: Март 2010  






Djin_dj, а поподробнее можно?
Вот ячейка
CODE (htmlphp):
скопировать код в буфер обмена
  1.  
  2. <tr><td class=wbmap><a href=http://456.hx0.ru/realtyg.php?g=1><img src=http://images.ganjawars.ru/i/t.gif border=0 width=50 height=50 title='[G] West Village'></a></td>
  3.  

http://images.ganjawars.ru/i/t.gif - основная рамка, её нода заменить на другую картинку, при нажатии.
 
 Top
Viper
Отправлено: 10 Марта, 2010 - 09:56:52
Post Id



Мастер


Покинул форум
Сообщений всего: 948
Дата рег-ции: Февр. 2007  
Откуда: Симферополь






 а псевдоклассы для чего придумали?

CODE (htmlphp):
скопировать код в буфер обмена
  1. .wbmap a img {
  2.         border: 1px solid transparent;
  3. }
  4.  
  5. .wbmap a img:hover {
  6.         border: 1px solid #ebebeb;
  7. }


конкретно для вашего случая. первое правило обязательно, чтобы не "прыгал" размер ячейки таблицы(т.к. размер её у вас не указан а рамка добавляет при наведении 1 пиксел на каждую сторону).
для firefox можно указать outline, тогда первое правило будет не нужно.

-----

Нажмите для увеличения

/* Have a nice day! */
 
 Top
DeepVarvar
Отправлено: 10 Марта, 2010 - 11:25:48
Post Id



Мастер


Покинул форум
Сообщений всего: 522
Дата рег-ции: Дек. 2008  
Откуда: Масква






 onClick

-----
Оцените песенку: http://www.youtube.com/watch?v=dCRpFuRzY80 )))))))
 
 Top
JustUserR Модератор
Отправлено: 10 Марта, 2010 - 17:23:05
Post Id



Эксперт


Покинул форум
Сообщений всего: 5854
Дата рег-ции: Июнь 2009  






GFox Задача достаточно стндартная и простая - просто для тега img добавляете событие типа onClick="this.style.width='100px'; this.style.height='100px'" - если нужно что-то псложенее то передаете данные функции-обработчику - при этом событие можно вообще обрабатываться динамически

-----
Сделать можно все что угодно - нужно только старание, терпение и хороший поисковик Улыбка
Хороший хостинг от 15 рублей в месяц (За 40 МБ места) - http://ihost.oks71.ru
Бесплатная учебная литература по программированию - http://progbook.ru
 
 Top
GFox
Отправлено: 10 Марта, 2010 - 19:03:07
Post Id


Новичок


Покинул форум
Сообщений всего: 35
Дата рег-ции: Март 2010  






1. Большое спасибо всем, кто отписался )

2. Я только начал разбиратся в построении сайтов, не все функции и возможности знаю , может быть я Вас не правильно понял, но мне не размер рамки менять надо, а саму рамку (1.gif на 2.gif)

Вот пример:
http://456.hx0.ru/test.php
 
 Top
duk
Отправлено: 10 Марта, 2010 - 20:31:41
Post Id



Member


Покинул форум
Сообщений всего: 107
Дата рег-ции: Февр. 2010  
Откуда: Москва






 <tr><td class=wbmap><a href=http://456.hx0.ru/realtyg.php?g=1><img src=http://images.ganjawars.ru/i/<?php (isset($_GET['g'] and $_GET['g']==1) : 1 ? 2 ?>.gif border=0 width=50 height=50 title='[G] West Village'></a></td>
 
 Top
DeepVarvar
Отправлено: 10 Марта, 2010 - 21:52:30
Post Id



Мастер


Покинул форум
Сообщений всего: 522
Дата рег-ции: Дек. 2008  
Откуда: Масква






 onClick="this.style.background:url(pach/do/img2.gif);"

-----
Оцените песенку: http://www.youtube.com/watch?v=dCRpFuRzY80 )))))))
 
 Top
GFox
Отправлено: 10 Марта, 2010 - 22:52:44
Post Id


Новичок


Покинул форум
Сообщений всего: 35
Дата рег-ции: Март 2010  






Что-то не получается(
duk - С Вашим вариантом страничка не грузится вообще
DeepVarvar - С Вашим вариантом фон меняется при нажатии и сразу возвращается старый, это немного не то
 
 Top
JustUserR Модератор
Отправлено: 11 Марта, 2010 - 13:54:27
Post Id



Эксперт


Покинул форум
Сообщений всего: 5854
Дата рег-ции: Июнь 2009  






GFox пишет:
Я только начал разбиратся в построении сайтов, не все функции и возможности знаю , может быть я Вас не правильно понял, но мне не размер рамки менять надо, а саму рамку (1.gif на 2.gif)
Если рамкой является сам img-элемент то меняете следующим образом onClick="this.src='2.gif'" - конечно надо не забывать правильно прописывать относительные пути и желаьное бы подгружать картинку заранее чтоб она могла смениться без загрузки

-----
Сделать можно все что угодно - нужно только старание, терпение и хороший поисковик Улыбка
Хороший хостинг от 15 рублей в месяц (За 40 МБ места) - http://ihost.oks71.ru
Бесплатная учебная литература по программированию - http://progbook.ru
 
 Top
duk
Отправлено: 11 Марта, 2010 - 14:01:12
Post Id



Member


Покинул форум
Сообщений всего: 107
Дата рег-ции: Февр. 2010  
Откуда: Москва
GFox пишет:

duk - С Вашим вариантом страничка не грузится вообще


Ну еще бы, я ж там скобку пропустил
 
 Top
JustUserR Модератор
Отправлено: 11 Марта, 2010 - 14:17:02
Post Id



Эксперт


Покинул форум
Сообщений всего: 5854
Дата рег-ции: Июнь 2009  






duk пишет:
Ну еще бы, я ж там скобку пропустил
Да и со скобкой не будет работать - в вашем коде вообще нет никакой JS-функции которая бы отвечала за изменение рамки - если на том сайте с которого вы взяли код это работало то там были вшение JS-функий которые динамически формировали обработку событий скжем по ID или className контейнера

-----
Сделать можно все что угодно - нужно только старание, терпение и хороший поисковик Улыбка
Хороший хостинг от 15 рублей в месяц (За 40 МБ места) - http://ihost.oks71.ru
Бесплатная учебная литература по программированию - http://progbook.ru
 
 Top
duk
Отправлено: 11 Марта, 2010 - 15:37:52
Post Id



Member


Покинул форум
Сообщений всего: 107
Дата рег-ции: Февр. 2010  
Откуда: Москва






 а при чем здесь JS ?
Там при клике на ячейке происходит перезагрузка страницы по ссылке, с гет параметром. Вот при формировании страницы самое время поставить нужную рамку
 
 Top
GFox
Отправлено: 11 Марта, 2010 - 19:09:57
Post Id


Новичок


Покинул форум
Сообщений всего: 35
Дата рег-ции: Март 2010  






JustUserR пишет:
GFox пишет:
Я только начал разбиратся в построении сайтов, не все функции и возможности знаю , может быть я Вас не правильно понял, но мне не размер рамки менять надо, а саму рамку (1.gif на 2.gif)
Если рамкой является сам img-элемент то меняете следующим образом onClick="this.src='2.gif'" - конечно надо не забывать правильно прописывать относительные пути и желаьное бы подгружать картинку заранее чтоб она могла смениться без загрузки


Рамка появляется в момент нажатия, на долю секунды, и сразу исчезает, а нужно, что бы она менялась на новую и оставалась до тех порт, пока человек не нажмет на другой сектор (ячейку таблички), и тогда эта рамка (новая) перезодит на тот сектор, на который нажали.
 
 Top
Поиск в теме | Версия для печати
Страниц (2): [1] 2 »
Сейчас эту тему просматривают: 1 (гостей: 1, зарегистрированных: 0)
« Программирование на PHP »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
  




 
Powered by ExBB FM 1.0 RC1. InvisionExBB