Перейти к содержимому


Пользователь месяца
WGN WGN 1-й за Июль
Очков активности: 850 2 темы, 75 сообщений, 7 баллов репутации
Сайт: worldgamenews.com
ТОП самых активных за этот месяц
  • Фотография TimurR
    #1

    TimurR
    Очков активности: 273 3 темы, 17 сообщений, 7 баллов репутации

  • Фотография WGN
    #2

    WGN (worldgamenews.com)
    Очков активности: 66 Вне конкурса за определение пользователя месяца

  • Фотография ShowPrint
    #3

    ShowPrint (ShowPrint.ru)
    Очков активности: 52.5 0 тем, 7 сообщений, 5 баллов репутации

  • Фотография BlackLion
    #4

    BlackLion
    Очков активности: 36 0 тем, 24 сообщения, 1 балл репутации

  • Фотография Vmir
    #5

    Vmir
    Очков активности: 25.5 Вне конкурса за определение пользователя месяца

  • Фотография Napoleon-007
    #6

    Napoleon-007
    Очков активности: 21 0 тем, 14 сообщений, 1 балл репутации

  • Фотография Ixman
    #7

    Ixman (o5cat.ru)
    Очков активности: 21 0 тем, 7 сообщений, 2 балла репутации

  • Фотография alekswebart
    #8

    alekswebart
    Очков активности: 19.5 1 тема, 10 сообщений, 1 балл репутации

  • Фотография r0mZet
    #9

    r0mZet (rz-style.ru)
    Очков активности: 18 2 темы, 6 сообщений, 1 балл репутации

  • Фотография profi
    #10

    profi (1informer.com)
    Очков активности: 12 0 тем, 8 сообщений, 1 балл репутации

  • Показать весь ТОП 10

Kwork.ru - услуги фрилансеров от 500 руб.

Поддержите форум! =)
Апдейты
  • Яндекс тИЦ: 19.11.2017
  • Яндекс выдача: 17.08.2018
Топ 5 участников по репутации


Плавающий размер картинок

#1 Matt

Matt
  • Неактивные
  • 774 сообщений
  • Репутация: 2
0

Отправлено 04 October 2010 - 11:01

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

 

 

  • 0

robot

robot
  • Пользователь PRO
  • 2652 сообщений
  • Репутация: 85
Советую обратить внимание на следующее:
  1. Зафиксировать изображение (резиновый фон)
  2. Как вписать изображение в размер окна браузера при помощи html/css
  3. Фото разных размеров, как сделать через css, вывод фото с одинаковыми пропорциям
  4. Изменение размера картинки при уменьшении окна браузера
  5. Как сделать чтобы картинка по ширине подстраивалась под блог?

#2 bestolloch

bestolloch
  • Неактивные
  • 224 сообщений
  • Репутация: 1

Отправлено 04 October 2010 - 12:03

Средствами html и css только если
a:hover
ну просто выставляется для этого значение другое значение поля (более большое)
  • 0

#3 yury

yury
  • Пользователь
  • 642 сообщений
  • Репутация: 188

Отправлено 04 October 2010 - 13:10

<html>
<head>
<title>hover</title>
<style type="text/css">
A.hover {
background: url(small.gif); /* Путь к файлу с исходным рисунком */
display: block; /* Рисунок как блочный элемент */
width: 60px; /* Ширина маленького рисунка */
height: 30px; /* Высота маленького рисунка */
}
A.hover:hover {
background: url(big.gif); /* Путь к файлу с заменяемым рисунком */
width: 120px; /* Ширина большого рисунка */
height: 60px; /* Высота большого рисунка */
}
</style>
</head>
<body>
<p><a href="big.gif" class="hover"> </a></p>
</body>
</html>
маленькая картинка small.gif 0ae4bd660175.gif
большая картинка big.gif b5f4a13ecf78.gif
  • 0

#4 bestolloch

bestolloch
  • Неактивные
  • 224 сообщений
  • Репутация: 1

Отправлено 04 October 2010 - 13:24

у тебя показано 2 картинки ховер


  • 0

#5 yury

yury
  • Пользователь
  • 642 сообщений
  • Репутация: 188

Отправлено 04 October 2010 - 13:28

bestolloch,
вас что-то не устраивает или что-то непонятно?
Это рабочий пример и в нем все правильно написано.


  • 0

#6 bestolloch

bestolloch
  • Неактивные
  • 224 сообщений
  • Репутация: 1

Отправлено 04 October 2010 - 13:33

Сорри - чет не заметил, сорри))


  • 0

#7 surfer

surfer
  • Заблокированные
  • 1956 сообщений
  • Репутация: 71

Отправлено 04 October 2010 - 21:53

держи http://www.dynamicdr...ry/category/C4/
  • 0

#8 Matt

Matt
    Topic Starter
  • Неактивные
  • 774 сообщений
  • Репутация: 2

Отправлено 01 February 2011 - 13:12

Недавно заметил, что IE7-8 некорректно выводят конструкцию с изменяемым размером, ствя большее изображение под меньшее (все остальные браузеры отображают нормально). Конструкция такая:
<a class="thumbnail1" href="" title=""><img alt="" src="images/foto/foto.jpg" style="width: 170px; height: 248px" /><span><img src="images/foto/foto.jpg" /></span></a>


Стили:
.thumbnail1{
position: relative;
z-index: 0;
}
.thumbnail1:hover{
background-color: transparent;
z-index: 50;
}
.thumbnail1 span{ /*CSS for enlarged image*/
position: absolute;
background-color: transparent;
padding: 4px;
right: 1000px;
border: 0px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}
.thumbnail1 span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 0px;
}
.thumbnail1:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 500;
right: 60px; /*position where enlarged image should offset horizontally */
}

  • 0

robot

robot
  • Пользователь PRO
  • 2652 сообщений
  • Репутация: 85


Похожие темы

  Название темы Автор Статистика Последнее сообщение

Оформление форума – IPBSkins.ru