Куда и как вставить ссылку на возврат в index.html?

@rolandas · Регистрация: 20.04.2011

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

открываются картинки в случайном порядке, при нажатии на маленькую, она открываеться полноразмерно.
но как нажав на эту полноразмерную перенаправить назад в index.html ?

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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
function randomImg(){
 
 var myImages = new Array () ;
 
myImages[1] = "picks/01.jpg"; 
myImages[2] = "picks/02.jpg";
myImages[3] = "picks/03.jpg";
myImages[4] = "picks/04.jpg";
myImages[5] = "picks/05.jpg";
myImages[6] = "picks/06.jpg";
myImages[7] = "picks/07.jpg";
myImages[8] = "picks/08.jpg";
myImages[9] = "picks/09.jpg";
myImages[10] = "picks/10.jpg";
 
var myLinks = new Array() ;
var back = new Array();
 
back[1] = "index.html";
 
myLinks[1] = "picks/01.jpg";
myLinks[2] = "picks/02.jpg";
myLinks[3] = "picks/03.jpg";
myLinks[4] = "picks/04.jpg";
myLinks[5] = "picks/05.jpg";
myLinks[6] = "picks/06.jpg";
myLinks[7] = "picks/07.jpg";
myLinks[8] = "picks/08.jpg";
myLinks[9] = "picks/09.jpg";
myLinks[10] = "picks/10.jpg";
 
var rnd = Math.floor(Math .random() * myImages.length);
if(rnd == 0){
rnd = 1;
}
 
document.write ('<a href='+myLinks[rnd]+'><img src='+myImages[rnd]+' border="3" width="200" height="150"></a>');
}
 
window.onclick = myFunction;
function myFunction() {
document.getElementsByTagName("BODY")[0].style.backgroundColor = "yellow";
}

@Mr_Sergo · 16.12.2018, 01:44

Сообщение от rolandas

открываеться полноразмерно

И куда же при этом выполняется переход?

@rolandas · 16.12.2018, 01:48 **[ТС]**

Сообщение от Mr_Sergo

И куда же при этом выполняется переход?

после нажатия на фотку должно прямо на index.html

вот сайт: https://mindspick.netlify.com/

@Mr_Sergo · 16.12.2018, 01:55

Сообщение от rolandas

должно прямо на index.html

Ну это-то понятно. Не понятно куда выполняется переход при нажатии "на маленькую"?

Добавлено через 4 минуты
А зачем вы сделали так что при клике на картинку она открывается в новом окне?

Добавлено через 43 секунды
В смысле в этом же окне- но происходит редирект?

@rolandas · 16.12.2018, 01:56 **[ТС]**

Сообщение от Mr_Sergo

Ну это-то понятно. Не понятно куда выполняется переход при нажатии "на маленькую"?

как я понимяю всё и происходит в той самой index.html но может и ошибаюсь..

HTML5
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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
<!doctype html>
<html lang="en">
 <head>
<link rel="shortcut icon" type="image/png" href="favicon.png"/>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="жжж">
  <meta name="Keywords" content="MindsPick">
  <meta name="Description" content="MindsPick">
  <title>MindsPick</title>
  <script type="text/javascript" src="rulio.js"></script>
  <link rel="stylesheet" type="text/css" href="config.css">
 </head>
<center><br><br>
<table>
<tr>
<td>
    <a href="http://www.reliablecounter.com" target="_blank"><img src="http://www.reliablecounter.com/count.php?page=mindspick.bitballoon.com/&digit=style/lcd/3/&reloads=1" alt="" title="" border="0"></a><br /><a href="http://" target="_blank" style="font-family: Geneva, Arial; font-size: 9px; color: #330010; text-decoration: none;"></a>
    </td>
    
    <td><font size="22" color="#ffff00">&nbsp;&nbsp;MindsPick</font>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </td>
    <td><a href="index.html"> <input type=button class="test"  style="font-size : 30px;" value=" refresh 12 " onclick=""></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td><a href="index2.html"> <input type=button class="test" style="font-size : 30px;"value=" Factory Two " onclick=""></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td><a href="index3.html"> <input type=button class="test" style="font-size : 30px;"value=" Change One " onclick=""></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>
    <a href="http://www.reliablecounter.com" target="_blank"><img src="http://www.reliablecounter.com/count.php?page=mindspick.bitballoon.com/&digit=style/lcd/3/&reloads=0" alt="" title="" border="0"></a><br /><a href="http://" target="_blank" style="font-family: Geneva, Arial; font-size: 9px; color: #330010; text-decoration: none;"></a>
    </td>
</tr>
</table>
<br><br>
 
<table>
<tr>
    <td><script type="text/javascript">
randomImg();
 
</script></td>
    <td><script type="text/javascript">
randomImg();
</script></td>
    <td><script type="text/javascript">
randomImg();
</script></td>
    <td><script type="text/javascript">
randomImg();
</script></td>
</tr>
<tr>
    <td><script type="text/javascript">
randomImg();
</script></td>
    <td><script type="text/javascript">
randomImg();
</script></td>
    <td><script type="text/javascript">
randomImg();
</script></td>
    <td><script type="text/javascript">
randomImg();
</script></td>
</tr>
<tr>
    <td><script type="text/javascript">
randomImg();
</script></td>
    <td><script type="text/javascript">
randomImg();
</script></td>
    <td><script type="text/javascript">
randomImg();
</script></td>
    <td><script type="text/javascript">
randomImg();
</script></td>
</tr>
</table>
</center>
 </body>
</html>

@Mr_Sergo · 16.12.2018, 01:58

Быть может нужно сделать примерно как тут -> https://yandex.ru/images/searc... 1%81%D1%8F

Добавлено через 24 секунды
???

@rolandas · 16.12.2018, 02:01 **[ТС]**

Сообщение от Mr_Sergo

Быть может нужно сделать примерно как тут

да, но я по шаблону слепил, просто интересно есть решение прямо из ява скрипта поредагировать как то..
просто по структуре html нет понятия,
например показ картинки: https://mindspick.netlify.com/picks/2771.jpg
а это ведь из index.html ?

@Mr_Sergo · 16.12.2018, 02:06

Сообщение от rolandas

поредагировать

Но вы ж хотя бы с русским-то языком поладьте... потом уж за js начнем говорить

Добавлено через 1 минуту
складывается такое впечатление что вы общаетесь с каким-то животным...
Вы хоть пишите-то правильно!

Добавлено через 1 минуту
не открывается ваша ссылка

@rolandas · 16.12.2018, 02:09 **[ТС]**

Сообщение от Mr_Sergo

правильно

внести изменения

так сойдёт?
вы понимаете и чем я. если решение в принципе не возможно - так и скажите.
у меня красиво открывается.. https://mindspick.netlify.com/

@Mr_Sergo · 16.12.2018, 02:13

Сообщение от rolandas

не возможно

возможно

Добавлено через 1 минуту
делов-то...
при клике на картинку нужно открывать "поп-ап" а не редиректить куда-то там... вот вам и все решение

@rolandas · 16.12.2018, 02:17 **[ТС]**

Сообщение от Mr_Sergo

нужно открывать "поп-ап"

картинку уже открывает сам скрипт, так куда «поп-ап» запихивать?

@Mr_Sergo · 16.12.2018, 02:19

Сообщение от rolandas

куда «поп-ап» запихивать

ну дык наверное просто нужно переписать "сам скрипт"? Не... не подойдет?

@rolandas · 16.12.2018, 02:21 **[ТС]**

Сообщение от Mr_Sergo

Не... не подойдет?

подойдет, если другой шаблон найду

@Mr_Sergo · 16.12.2018, 02:21

вообщем если вам никто не поможет я завтра накидаю вам приблизительный скрипт, дальше как хотите

@rolandas · 16.12.2018, 02:26 **[ТС]**

Сообщение от Mr_Sergo

приблизительный скрипт

спасибо, пока попробую поместить <a href="index.html"></a>

куданибудь здесь:

JavaScript
1
2
3
4
5
6
7
document.write ('<a href='+myLinks[rnd]+'><img src='+myImages[rnd]+' border="3" width="200" height="150"></a>');
}
 
window.onclick = myFunction;
function myFunction() {
document.getElementsByTagName("BODY")[0].style.backgroundColor = "yellow";
}

@Mr_Sergo · 16.12.2018, 18:22

rolandas,

Я бы сделал примерно так -> https://codepen.io/Mr_Sergo/full/ZVOGeg

HTML5
1
2
3
4
5
6
7
8
<div class="overlay">
    <div class="wrapImg"><img src="" class="changeImg"></div>
</div>
 
<div class="imgBox">
    <img src="https://shkolazhizni.ru/img/content/i156/156707_or.jpg">
    <img src="https://avatars.mds.yandex.net/get-zen_doc/225901/pub_5bae1fad4c48e200aac9a47b_5bae216f95fd3e00ab564581/scale_600">
</div>

JavaScript
1
2
3
4
5
6
let imgBox = document.querySelectorAll('.imgBox')[0],
    overlay = document.querySelectorAll('.overlay')[0],
    changeImg = document.querySelectorAll('.changeImg')[0];
 
imgBox.addEventListener('click',e => e.target.tagName == 'IMG' ? (overlay.style.display = 'block', changeImg.src = e.target.src) : '');
overlay.addEventListener('click',e => e.target.tagName !== 'IMG' ? overlay.style.display = 'none' : '');

CSS
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
html, body{margin: 0px 0px 0px 0px;width:  100%;}
 
.overlay{
    width: 100%;
    height: 100%;
    position: fixed;
    background: rgba(0, 0, 0, 0.8);
    display: none;
    cursor: pointer;
}
 
.changeImg{
    width: 100%;
    position: relative;
    top: 20px;
    cursor: default;
}
 
.wrapImg{
    width: 600px;
    margin: 0px auto;
}
 
img{
    width: 200px;
    cursor: pointer;
}

@rolandas · 16.12.2018, 18:38 **[ТС]**

Сообщение от Mr_Sergo

примерно так

Спасибуль, попробую ваш код.

@Mr_Sergo · 16.12.2018, 18:52

rolandas,
Если уж очень хочется что бы картинки открывались в полном размере то можно примерно так -> https://codepen.io/Mr_Sergo/full/qLNdgj

HTML5
1
2
3
4
5
6
7
8
<div class="overlay">
    <div class="wrapImg"><img src="" class="changeImg"></div>
</div>
 
<div class="imgBox">
    <img src="https://shkolazhizni.ru/img/content/i156/156707_or.jpg">
    <img src="https://avatars.mds.yandex.net/get-zen_doc/225901/pub_5bae1fad4c48e200aac9a47b_5bae216f95fd3e00ab564581/scale_600">
</div>

JavaScript
1
2
3
4
5
6
let imgBox = document.querySelectorAll('.imgBox')[0],
    overlay = document.querySelectorAll('.overlay')[0],
    changeImg = document.querySelectorAll('.changeImg')[0];
 
overlay.addEventListener('click',() => overlay.style.display = 'none');
imgBox.addEventListener('click',e => e.target.tagName == 'IMG' ? (overlay.style.display = 'block', changeImg.style.width = e.target.naturalWidth + 'px', changeImg.src = e.target.src) : '');

CSS
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
html, body{margin: 0px 0px 0px 0px; width: 100%;}
 
.overlay{
    width: 100%;
    height: 100%;
    position: fixed;
    background: rgba(0, 0, 0, 0.8);
    display: none;
    cursor: pointer;
}
 
.changeImg{
    position: relative;
    top: 20px;
}
 
.wrapImg{
    width: fit-content;
    margin: 0px auto;
}
 
img{
    width: 200px;
    cursor: pointer;
}

В css возможно есть что-то лишнее...

@rolandas · 16.12.2018, 19:08 **[ТС]**

Сообщение от Mr_Sergo

Если уж очень хочется

нужно.

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>MindsPick</title>
  <script type="text/javascript" src="rulio.js"></script>
  <link rel="stylesheet" type="text/css" href="config.css">
 </head>
<center><br><br>
 
    <div class="overlay">
    <div class="wrapImg"><img src="" class="changeImg"></div>
</div>
 
<div class="imgBox">
    <img src="picks/01.jpg">
    <img src="picks/02.jpg">
</div>
 
</center>
 </body>
</html>

пока не работает - открывает лишь малоразмерные, клики над ними без реакции..

@Mr_Sergo · 16.12.2018, 19:45

rolandas,
Сначала подключаете css- файл, а уж после js- файл, у вас наоборот, вот так будет правильно:

HTML5
1
2
<link rel="stylesheet" type="text/css" href="config.css">
<script type="text/javascript" src="rulio.js"></script>

Добавлено через 3 минуты
rolandas,
Запакуйте js-файл, который у вас не работает, в архив и скиньте сюда

Новые блоги и статьи Все статьи Все блоги /
Установка Android SDK, NDK, JDK, CMake и т.д. 8Observer8 25.01.2026 Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .	Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf 8Observer8 25.01.2026 Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .	Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly 8Observer8 24.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .	моя боль iceja 24.01.2026 Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .
Модель сукцессии микоризы anaschu 24.01.2026 Решили писать научную статью с неким РОманом	http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .	http://iceja.net/ сервер решения полиномов iceja 18.01.2026 Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .	Расчёт переходных процессов в цепи постоянного тока igorrr37 16.01.2026 / * Дана цепь(не выше 3-го порядка) постоянного тока с элементами R, L, C, k(ключ), U, E, J. Программа находит переходные токи и напряжения на элементах схемы классическим методом(1 и 2 з-ны. . .

@Mr_Sergo 2037 / 1096 / 409 Регистрация: 29.04.2016 Сообщений: 2,625
	16.12.2018, 01:58
	Быть может нужно сделать примерно как тут -> https://yandex.ru/images/searc... 1%81%D1%8F Добавлено через 24 секунды ??? 0

@Mr_Sergo 2037 / 1096 / 409 Регистрация: 29.04.2016 Сообщений: 2,625
	16.12.2018, 02:21
	вообщем если вам никто не поможет я завтра накидаю вам приблизительный скрипт, дальше как хотите 1