увеличение - уменьшение изображения

@subbota1984 · Регистрация: 19.11.2009

Студворк — интернет-сервис помощи студентам

пример вот здесь - http://www.el-tuning.ru/index.html
сделать средствами HTML

@xxxNEIxxx · 18.06.2010, 22:59

средствами html, именно такое зделать не реально. пошаманить можно но такого результату просто через html не достигнешь. Это делается при помощи скриптов и этот вопрос уже просматривался, вот Ссылка

@subbota1984 · 18.06.2010, 23:36 **[ТС]**

спасибо это я видел - ну я имел ввиду типа этого что-нибудь но на HTML

Добавлено через 18 минут
вот код не давно обсуждалась эта тема но к сожалению я здесь ни чего не понимаю, но ясно что не HTML

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script>
function resisize(id)
{
        var big = '500', small='100';
        if(document.getElementById(id).width == big)
        {
                document.getElementById(id).width = small;
        }
        else
        {
                document.getElementById(id).width = big;
        }
}
</script>
 
<img id="img" onClick="resisize('img');" src="img/radio.png" width="100" border="0">

куда вставлять этот код, где менять имя графического файла если не трудно обьясните кто - нибудь

@romchiksoad · 19.06.2010, 08:52

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<html>
   <head>
       <title>Заголовок страницы</title>
       <script>
           function resisize(id)
           {
              var big = '500', small='100';
              if(document.getElementById(id).width == big)
                   document.getElementById(id).width = small;
              else
                   document.getElementById(id).width = big;
          }
       </script>
   </head>
   <body>
       ....
       <img id="img" onClick="resisize('img');" src="img/radio.png" width="100" border="0">
   </body>
</html>

Как-то так

Добавлено через 15 минут
Ах да, забыл сказать где меняем имя картинки:

HTML5
1
<img id="идентификатор картинки" onClick="resisize('img');" src="путь к картинке" width="размер картинки" border="0">

И так, теперь расшифровка:
id="идентификатор картинки" - благодаря этому, скрипт на js может определить, что это именно та картинка, которую необходимо изменять при кликах;
onClick="resisize('img');" - это событие( либо на js, либо на DHTML ), которое объясняет браузеру, когда( в нашем случае при клике ) нужно выполнить функцию, которая расположена у него в "голове". В скобках мы передаем то, что указано в id тега img;
src="путь к картинке" - ну тут понятно, пишем сюда где искать картинку;
width="размер картинки" - ширина картинки, можно указать в пикселах, а можно и в %;
border="0" - это убирает рамку вокруг картинки.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<script>
           function resisize(id)
           {
               //Определяем переменные
              //которые хранят нужные размеры изображения
 
              var big = '500', small='100';
            
              //Пишем условие, которое и будет уменьшать или увеличивать
              //в зависимости от того, что указано в width тега img
 
              if(document.getElementById(id).width == big)
 
                   //если ширина( width ) изображения не 100px( small ), а 500( big )
                   //то при клике на картинку изменяем на 100px( small )
 
                   document.getElementById(id).width = small;
 
              //в противном случае( если ширина картинки до клика равна 100px( small ) )
              //то при клике увеличиваем до 500px( big )
 
              else
 
                   document.getElementById(id).width = big;
 
          }
       </script>

@subbota1984 · 20.06.2010, 15:21 **[ТС]**

огромное спасибо romchiksoad, все панятно

30.12.2011, 09:08

а можно этот код как-нибудь переделать так чтобы картинка открывалась на 100% ?

Добавлено через 47 минут
вернее мне нужно сделать так.
Есть обычный пост с картинками нормального размера в блоге. Но на самом деле это картинки с большим разрешением типо 2000x2000 px. И вот когда наживаешь на отдельную картинку она превращается в 100% на той же странице без открытия окон, а просто сдвигая вниз остальные картинки. Такое можно сделать?

@Mi1ady · 30.12.2011, 09:20

По идее точно также, только в скрипте в параметре big ставите 100%

30.12.2011, 14:02

неа, не катит

Новые блоги и статьи Все статьи Все блоги /
изучаю kubernetes lagorue 13.01.2026 А пригодятся-ли мне знания kubernetes в России?	сукцессия микоризы: основная теория в виде двух уравнений. anaschu 11.01.2026 https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/	WordPad для Windows 11 Jel 10.01.2026 WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .	Classic Notepad for Windows 11 Jel 10.01.2026 Old Classic Notepad for Windows 11 Приложение для Windows 11, позволяющее пользователям вернуть классическую версию текстового редактора «Блокнот» из Windows 10. Программа предоставляет более. . .
Почему дизайн решает? Neotwalker 09.01.2026 В современном мире, где конкуренция за внимание потребителя достигла пика, дизайн становится мощным инструментом для успеха бренда. Это не просто красивый внешний вид продукта или сайта — это. . .	Модель микоризы: классовый агентный подход 3 anaschu 06.01.2026 aa0a7f55b50dd51c5ec569d2d10c54f6/ O1rJuneU_ls https:/ / vkvideo. ru/ video-115721503_456239114	Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ФедосеевПавел 06.01.2026 Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ВВЕДЕНИЕ Введу сокращения: аналоговый ПИД — ПИД регулятор с управляющим выходом в виде числа в диапазоне от 0% до. . .	Модель микоризы: классовый агентный подход 2 anaschu 06.01.2026 репозиторий https:/ / github. com/ shumilovas/ fungi ветка по-частям. коммит Create переделка под биомассу. txt вход sc, но sm считается внутри мицелия. кстати, обьем тоже должен там считаться. . . .

@subbota1984 0 / 0 / 0 Регистрация: 19.11.2009 Сообщений: 53

	увеличение - уменьшение изображения 18.06.2010, 22:48. Показов 11711. Ответов 7 Метки нет (Все метки) пример вот здесь - http://www.el-tuning.ru/index.html сделать средствами HTML 0

@xxxNEIxxx 28 / 28 / 2 Регистрация: 21.04.2010 Сообщений: 121
	18.06.2010, 22:59
	средствами html, именно такое зделать не реально. пошаманить можно но такого результату просто через html не достигнешь. Это делается при помощи скриптов и этот вопрос уже просматривался, вот Ссылка 0

@subbota1984 0 / 0 / 0 Регистрация: 19.11.2009 Сообщений: 53
	20.06.2010, 15:21 [ТС]
	огромное спасибо romchiksoad, все панятно 0

Lichi
	30.12.2011, 09:08
	а можно этот код как-нибудь переделать так чтобы картинка открывалась на 100% ? Добавлено через 47 минут вернее мне нужно сделать так. Есть обычный пост с картинками нормального размера в блоге. Но на самом деле это картинки с большим разрешением типо 2000x2000 px. И вот когда наживаешь на отдельную картинку она превращается в 100% на той же странице без открытия окон, а просто сдвигая вниз остальные картинки. Такое можно сделать?

@Mi1ady 51 / 23 / 1 Регистрация: 18.12.2011 Сообщений: 101
	30.12.2011, 09:20
	По идее точно также, только в скрипте в параметре big ставите 100% 0