Нужен совет

 
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1170
Итак, есть большая картинка и есть 4-5 маленьких.

Как сделать чтбы в статье можно было разместить большую картинку и на ней 4-5 маленьких, но чтобы маленькие были кликабельны и были гиперссылками?
Заранее благодарен за ответы и советы!
Редактировалось: 2 раз (Последний: 27 апреля 2013 в 11:54)
Посетитель
small user social cms
МедальКубок зрительских симпатий
Сообщений: 330
плохо представляю.. расскажи поподробнее...
Реклама
cms
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1170
Подробнее...)
Есть карта мира (к примеру).....на ней хочу разместить объекты, при нажатии на которые делался бы переход на видео (к примеру)
Карта мира- это сравнительный образ, вместо неё будет большая картинка.
Редактировалось: 2 раз (Последний: 27 апреля 2013 в 12:12)
Посетитель
small user social cms
Медаль
Сообщений: 455
Я бы наверное решил этот вопрос через flash, потому как иначе все разлезится
Чистить кэш, исправлять базу ручками и искать в гугле умею. Если задаю вопрос, то значит есть существенная причина!!!
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1170
Ещё есть простые и действенные решения (без флеш)?
Посетитель
small user social cms
МедальКубок зрительских симпатий
Сообщений: 330
Maikl, к сожалению не знаю...
InstantCMS Team
small user social cms
МедальКубок зрительских симпатийАвторитет форумаПатриот InstantCMS ;-)
Сообщений: 3129
Maikl:
Ещё есть простые и действенные решения (без флеш)?
Простых решений точно нет, но и без флеша можно обойтись - вот например:
Скрытый текст виден только зарегистрированным пользователям

Исходный код образца в помощь.
Зарабатываю здесь - Хостинг здесь - Жить в обществе и быть свободным от общества нельзя!...
Посетитель
small user social cms
Медаль
Сообщений: 296
Простым решением станет следующее:
1. делаем большую картинку бекграундом дива
2. абсолютным позиционированием располагаем дивы на подложке в нужном месте, делаем их кликабельными
3. бекграунлом в п2. загоняем нужные маленькие картинки

если нужно динамически добавлять маленькие картинки то хз надо пробовать и программинг знать больше чем я

Вот примерно
Код PHP:
  1.  
  2. HTML
  3. <div id="big_img">
  4. <div id="1_img"></div>
  5. <div id="2_img"></div>
  6. <div id="3_img"></div>
  7. <div id="4_img"></div>
  8. </div>
  9.  
  10. CSS
  11. #big_img {
  12. position: relative; /* Относительное позиционирование */
  13. background: url(images/big_img.png) no-repeat #f0f0f0; /* Картинка и цвет фона */
  14. height: 600px; /* Высота блока */
  15. width: 800px; /* Ширина блока */
  16. }
  17. #1_img {
  18. position: absolute;
  19. right: 100px; bottom: 200px" /* Положение от правого нижнего угла */
  20. height: 50px; width: 50px;/* Размеры блока */
  21. background: url(images/1_img.png) no-repeat #f0f0f0; /* Картинка и цвет фона */
  22. }
  23. #2_img {
  24. position: absolute;
  25. right: 10px; top: 15px; /* Положение от правого верхнего угла */
  26. height: 50px; width: 50px;/* Размеры блока */
  27. background: url(images/2_img.png) no-repeat #f0f0f0; /* Картинка и цвет фона */
  28. }
  29. #3_img {
  30. position: absolute;
  31. left: 100px; bottom: 200px" /* Положение от левого нижнего угла */
  32. height: 50px; width: 50px;/* Размеры блока */
  33. background: url(images/3_img.png) no-repeat #f0f0f0; /* Картинка и цвет фона */
  34. }
  35. #4_img {
  36. position: absolute;
  37. left: 100px; top: 200px" /* Положение от левого нижнего угла */
  38. height: 50px; width: 50px;/* Размеры блока */
  39. background: url(images/4_img.png) no-repeat #f0f0f0; /* Картинка и цвет фона */
  40. }
  41.  
Редактировалось: 1 раз (Последний: 27 апреля 2013 в 15:30)
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1170
VopisUVD:

Простым решением станет следующее:
1. делаем большую картинку бекграундом дива
2. абсолютным позиционированием располагаем дивы на подложке в нужном месте, делаем их кликабельными
3. бекграунлом в п2. загоняем нужные маленькие картинки

если нужно динамически добавлять маленькие картинки то хз надо пробовать и программинг знать больше чем я
Привидите пжл пример ниже (кодом)
Редактировалось: 2 раз (Последний: 27 апреля 2013 в 15:26)
Посетитель
small user social cms
Медаль
Сообщений: 296
Maikl:
Привидите пжл пример ниже (кодом)
Сразу о примере подумал и раньше отредактировал...
Но код можно и по другому сделать...
Редактировалось: 1 раз (Последний: 27 апреля 2013 в 15:32)
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1170
VopisUVD:

Maikl:
Привидите пжл пример ниже (кодом)
Сразу о примере подумал и раньше отредактировал...
Но код можно и по другому сделать...
В статье данный код не работает!
Код "режется"
InstantCMS Team
small user social cms
МедальКубок зрительских симпатийАвторитет форумаПатриот InstantCMS ;-)
Сообщений: 3129
Maikl:
В статье данный код не работает!
Код "режется"
Будет точно работать если вставить через внешний файл, плюс убрать можно комментарии с кавычками, плюс, все точки с запятой проверить ...
Зарабатываю здесь - Хостинг здесь - Жить в обществе и быть свободным от общества нельзя!...
Посетитель
small user social cms
Медаль
Сообщений: 296
Maikl:
Код "режется"
Не режется просто нужно правильно его читать :)

HTML вставляете в тело страницы
CSS вставляете в стилевый файл
А вообще с такой тривиальной проблемой вам сюда htmlbook.ru
на указанном сайте вы найдете подробности и о раннее описаном Мадмаксом способе...
Редактировалось: 1 раз (Последний: 27 апреля 2013 в 16:26)
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1170
VopisUVD:

Maikl:
Код "режется"
Не режется просто нужно правильно его читать :)

HTML вставляете в тело страницы
CSS вставляете в стилевый файл
А вообще с такой тривиальной проблемой вам сюда htmlbook.ru
на указанном сайте вы найдете подробности и о раннее описаном Мадмаксом способе...
Так и сделал.
Большая картинка просматривается, а маленькие нет!!!
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1170
Madmax:

Maikl:
В статье данный код не работает!
Код "режется"
Будет точно работать если вставить через внешний файл, плюс убрать можно комментарии с кавычками, плюс, все точки с запятой проверить ...
Не совсем понял, весь код со стилями включить во внейшний файл или нет?
В начало страницы
Предыдущая темаСледующая тема Перейти на форум: