Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: Position: Relative

 PHP.SU

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


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

> Без описания
Поиск в теме | Версия для печати
Hurt
Отправлено: 27 Марта, 2011 - 10:56:17
Post Id



Новичок


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


Помог: 0 раз(а)
Добрый день всем!

У меня есть большое изображение. Мне на него нужно нанести другие маленькие изображения на которые можно кликать.

т.е. примерно вот так

CODE (html):
скопировать код в буфер обмена
  1. <div class="bigimage"></div>
  2.  
  3. <div class="smallimage1" style="position: relative; top: -56px; left: 254px;"><img src="point.jpg" /></div>
  4. <div class="smallimage2" style="position: relative; top: -22px; left: 350px;"><img src="point.jpg" /></div>
  5. <div class="smallimage3" style="position: relative; top: -151px; left: 559px;"><img src="point.jpg" /></div>


Но как я понял это самый худший вариант, потому что после большого изображения появляется огромное пустое место + появляется прокрутка экрана по горизонтали.

Как можно обойти эти недостатки?

(Отредактировано автором: 27 Марта, 2011 - 11:01:06)

 
 Top
Hurt
Отправлено: 27 Марта, 2011 - 14:45:51
Post Id



Новичок


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


Помог: 0 раз(а)
Вверх!
 
 Top
vsll
Отправлено: 27 Марта, 2011 - 15:16:51
Post Id


Частый посетитель


Покинул форум
Сообщений всего: 530
Дата рег-ции: Февр. 2011  


Помог: 10 раз(а)
<div class="bigimage" style="position: absolute;"></div>

http://htmlbook[dot]ru/css/position

http://htmlbook[dot]ru/css/overflow
 
 Top
Jampire
Отправлено: 27 Марта, 2011 - 19:29:36
Post Id



Гость


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


Помог: 0 раз(а)
Hurt, а какой смысл в div'ах ? картинки можно сделать кликабельными через onclick


-----
не будите во мне зверя!!! он и так не высыпается...
 
 Top
JustUserR
Отправлено: 28 Марта, 2011 - 01:45:24
Post Id



Активный участник


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


Помог: 17 раз(а)
Hurt пишет:
У меня есть большое изображение. Мне на него нужно нанести другие маленькие изображения на которые можно кликать.
В качестве возможного варианта для осуществления решения предполагаемой задачи, заключающся в проведении размещения целевой группы графических объектов на основании осуществления проведения их позиционирования относительно базового изображения, допустимо использование контейнерного определенного блока ассоциированного с внешней областью размещения целевых элементов, для которых производится процесс локального абсолютного позиционирования вложенных объектов на основании декларации CSS-свойств типа top/left


-----
Сделать можно все что угодно - нужно только старание, терпение и хороший поисковик Улыбка
Безлимитный web-хостинг от 15 рублей за 40 МБ дискового пространства - http://ihost[dot]oks71[dot]ru/
 
 Top
Hurt
Отправлено: 28 Марта, 2011 - 01:52:03
Post Id



Новичок


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


Помог: 0 раз(а)
Jampire пишет:
Hurt, а какой смысл в div'ах ? картинки можно сделать кликабельными через onclick

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

Vasiliya
CODE (html):
скопировать код в буфер обмена
  1. .worldwidemap
  2.     {
  3.         background: url(i/html/worldwide.jpg) no-repeat;
  4.         height: 407px;
  5.         width: 809px;
  6.         position: absolute;
  7.     }

CODE (html):
скопировать код в буфер обмена
  1. <div class="worldwidemap"></div>
  2.                                   <div style="position: relative; top: -350px; left: 280px;"><img src="i/html/track-point.png" /></div>
  3.                                   <div style="position: relative; top: -250px; left: 380px;"><img src="i/html/track-point.png" /></div>


Я то-то не так сделал? Результат не изменился(

(Отредактировано автором: 28 Марта, 2011 - 03:07:44)

 
 Top
JustUserR
Отправлено: 28 Марта, 2011 - 02:06:38
Post Id



Активный участник


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


Помог: 17 раз(а)
Hurt пишет:
Я то-то не так сделал? Результат не изменился(
JustUserR пишет:
В качестве возможного варианта для осуществления решения предполагаемой задачи, заключающся в проведении размещения целевой группы графических объектов на основании осуществления проведения их позиционирования относительно базового изображения, допустимо использование контейнерного определенного блока ассоциированного с внешней областью размещения целевых элементов, для которых производится процесс локального абсолютного позиционирования вложенных объектов на основании декларации CSS-свойств типа top/left


-----
Сделать можно все что угодно - нужно только старание, терпение и хороший поисковик Улыбка
Безлимитный web-хостинг от 15 рублей за 40 МБ дискового пространства - http://ihost[dot]oks71[dot]ru/
 
 Top
Hurt
Отправлено: 28 Марта, 2011 - 07:31:30
Post Id



Новичок


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


Помог: 0 раз(а)
JustUserR пишет:
Hurt пишет:
Я то-то не так сделал? Результат не изменился(
JustUserR пишет:
В качестве возможного варианта для осуществления решения предполагаемой задачи, заключающся в проведении размещения целевой группы графических объектов на основании осуществления проведения их позиционирования относительно базового изображения, допустимо использование контейнерного определенного блока ассоциированного с внешней областью размещения целевых элементов, для которых производится процесс локального абсолютного позиционирования вложенных объектов на основании декларации CSS-свойств типа top/left

Слишком легко)
 
 Top
DeepVarvar Супермодератор
Отправлено: 28 Марта, 2011 - 07:59:21
Post Id



Активный участник


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


Помог: 353 раз(а)
Hurt а не проще было бы использовать <map..... ???
 
 Top
Hurt
Отправлено: 28 Марта, 2011 - 08:14:50
Post Id



Новичок


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


Помог: 0 раз(а)
DeepVarvar пишет:
Hurt а не проще было бы использовать <map..... ???

Не нашел как в area вставить свое изображение(
 
 Top
JustUserR
Отправлено: 29 Марта, 2011 - 19:03:31
Post Id



Активный участник


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


Помог: 17 раз(а)
Hurt пишет:
Слишком легко)
Для осуществления решения предполагаемой задачи, заключающеся в проведении расположения целевых блочных объектов в заданных локальных позициях отображения, для которого обеспечивается выполнения аспекта размещения в соответственности с текущим размещением визуализационного объекта во внутреннем базовом элементром уровне трактования, допустимо использование следующей конструкции
CODE (HTML):
скопировать код в буфер обмена
  1. <div id="main">
  2. <div style="position:absolute; display:block; top:0px; left:0px; width:50%; height:50%">
  3. </div>
  4. <div style="position:absolute; display:block; top:101px; left:0px; width:50%; height:50%">
  5. </div>
  6. <div style="position:absolute; display:block; top:0px; left:101px; width:50%; height:50%">
  7. </div>
  8. <div style="position:absolute; display:block; top:101px; left:101px; width:50%; height:50%">
  9. </div>
  10. </div>


-----
Сделать можно все что угодно - нужно только старание, терпение и хороший поисковик Улыбка
Безлимитный web-хостинг от 15 рублей за 40 МБ дискового пространства - http://ihost[dot]oks71[dot]ru/
 
 Top
Поиск в теме | Версия для печати
Страниц (1): [1]
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« HTML, Дизайн & CSS »


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



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB