18.11.2022, 22:31
|
 |
Профессор
|
|
Регистрация: 03.02.2020
Сообщений: 2,703
|
|
Это не сложная задача.
Просто то, что вы делаете (document.write) - какой то ад.
Нужно просто правильно написать html файл, и правильно подключить скрипт.
Если подключаете в начале html файла, в разделе <head> то скрипт должен быть таким
const picurls = [{
src: 'http://00.gif?1',
href: 'http://google.com?1'
}, {
src: 'http://01.gif?2',
href: 'http://yahoo.com?2'
}, {
src: 'http://02.gif?3',
href: 'http://yandex.ru?3'
}, {
src: 'http://03.gif?4',
href: 'http://rambler.ru?4'
}];
const now = Date.now(); // мс с 01.01.1970
const msinday = 1000 * 60 * 60 * 24; // мс в сутках
const nowDay = Math.trunc(now / msinday); // дней с 01.01.1970
const ind = nowDay % picurls.length;
const obj = picurls[ind];
window.addEventListener('DOMContentLoaded', () => {
document.querySelector(".pic").src = obj.src;
document.querySelector("#pd").href = obj.href;
})
А если в конце (перед </body>) то можно так, как у рони |
|
18.11.2022, 22:49
|
|
Интересующийся
|
|
Регистрация: 02.11.2022
Сообщений: 23
|
|
Сообщение от voraa
|
Это не сложная задача.
Если подключаете в начале html файла, в разделе <head> то скрипт должен быть таким
|
Хорошо, я подключу его между <head>, но как мне вывести картинку в нужном месте страницы? |
|
18.11.2022, 22:53
|
|
Профессор
|
|
Регистрация: 03.02.2020
Сообщений: 2,703
|
|
|
Сообщение от Тапочек
|
|
Хорошо, я подключу его между <head>, но как мне вывести картинку в нужном месте страницы?
|
Поместить в нужное место страницы
<a href=index.htm id='pd'>
<img src="" class="pic">
</a>
|
|
18.11.2022, 22:58
|
|
Интересующийся
|
|
Регистрация: 02.11.2022
Сообщений: 23
|
|
|
Сообщение от voraa
|
Поместить в нужное место страницы
<a href=index.htm id='pd'>
<img src="" class="pic">
</a>
|
У меня на каждую картинку идёт отдельная страница с описанием. То есть, 50 картинок - 50 страниц |
|
18.11.2022, 23:03
|
|
Профессор
|
|
Регистрация: 03.02.2020
Сообщений: 2,703
|
|
|
Я уже совсем не понимаю, что вы делаете.
То вы пишете, что при открытии страницы, каждый раз на ней (на одной странице) должна показываться разная картинка.
Теперь вы пишете, что страниц 50.
Так, что каждый день должна открываться разная страница?
|
|
18.11.2022, 23:23
|
|
Интересующийся
|
|
Регистрация: 02.11.2022
Сообщений: 23
|
|
|
Начинаем заново, теперь максимально подробно. У меня одностраничный сайт по картам Таро (там древовидная система разделов). Слева в колонке есть место под т.н. "карту дня", которая должна меняться каждый день (она идёт картинкой-ссылкой, то есть кликаешь по ней и открывается новое окно (для каждой карты своя страница с описанием карты и прогнозом). С тем скриптом, который для вас "какой-то ад" это вроде как можно сделать, но там новая картинка (с ссылкой) циклически меняется только каждые 7 дней, а нужно каждые 56 дней (так как картинок-ссылок 56)
Я уже совсем не понимаю, как ещё можно объяснить. Я об этом писал ещё в первом сообщении
Последний раз редактировалось Тапочек, 18.11.2022 в 23:31.
|
|
19.11.2022, 08:46
|
|
Профессор
|
|
Регистрация: 03.02.2020
Сообщений: 2,703
|
|
|
Сообщение от Тапочек
|
|
У меня одностраничный сайт
|
|
Сообщение от Тапочек
|
|
кликаешь по ней и открывается новое окно (для каждой карты своя страница с описанием карты и прогнозом).
|
Так страница одна или 57 (56+1)?
На вашей странице (которая одна), слева в колонке, в коде HTML вставляете элементы
<a href=index.htm id='pd'>
<img src="" class="pic">
</a>
И подключаете скрипт. a - это ссылка на одну из 56 страниц. img - это одна из 56 картинок.
Скрипт в эти элементы сам запишет нужный href и нужный src.
Как вы открываете окно под картинкой, что в нем и откуда берется информация для него, вы не писали. |
|
19.11.2022, 10:14
|
|
Интересующийся
|
|
Регистрация: 02.11.2022
Сообщений: 23
|
|
|
Сообщение от voraa
|
|
Так страница одна или 57 (56+1)?
|
Отписался вам в личку |
|
21.11.2022, 02:11
|
|
Интересующийся
|
|
Регистрация: 02.11.2022
Сообщений: 23
|
|
К сожалению, готового решения пока что не нашлось. Тот скрипт, который давался сверху, не работает (ну или просто это не то, что нужно). Ещё раз попробую обрисовать, так сказать, техническое задание
Есть массив из 56 картинок. Нужно, чтобы на сайте каждый день показывалась новая картинка. Но не просто картинка, а картинка-ссылка (то есть, кликаешь по картинке и открывается новая страница - для каждой картинки своя). Вот примерный скрипт:
now = new Date()
if (now.getDay() == 0)
document.write("<a href=1.htm><img src=1.jpg></a>") // первая картинка-ссылка
if (now.getDay() == 1)
document.write("<a href=2.htm><img src=2.jpg></a>") // вторая картинка-ссылка
if (now.getDay() == 2)
document.write("<a href=3.htm><img src=3.jpg></a>") // третья картинка-ссылка и так далее
if (now.getDay() == 3)
document.write("<a href=4.htm><img src=4.jpg></a>")
if (now.getDay() == 4)
document.write("<a href=5.htm><img src=5.jpg></a>")
if (now.getDay() == 5)
document.write("<a href=6.htm><img src=6.jpg></a>")
if (now.getDay() == 6)
document.write("<a href=7.htm><img src=7.jpg></a>")
Конретно в этом скрипте (да, устаревшем, но он работает - это главное) циклично меняются только 7 картинок, а нужно 56. Идеально было бы, чтобы картинки менялись рандомно, но это, насколько я понял, сделать сложно. Надеюсь, рассказал доходчиво. Всем, кто откликнулся или откликнется - благодарочка и респект 
|
|
21.11.2022, 10:55
|
 |
Профессор
|
|
Регистрация: 19.01.2012
Сообщений: 498
|
|
Тапочек, скрипт для вас. Полагаю, что такая псевдослучайность для вашей задачи приемлема.
function getDayOfYear() {
var now = new Date();
var start = new Date(now.getFullYear(), 0, 0);
var diff = (now - start) + ((start.getTimezoneOffset() - now.getTimezoneOffset()) * 60 * 1000);
var oneDay = 1000 * 60 * 60 * 24;
return Math.floor(diff / oneDay);
}
function random(day) {
var r0 = day * 33 + 85017801 + (new Date()).getFullYear();
var left = ((parseInt('01111111110000000000000000000000', 2) & r0) >>> 23);
var r1 = (r0 << 9 >>> 1) | left;
var right = ((parseInt('111111111', 2)) & r0) << 24 >>> 1;
var r2 = (r0 >>> 8) | right;
r0 = r1 + r2;
return 1 + ((Math.floor(r0 / 99) + day) % 56);
}
var pic = random(getDayOfYear());
document.write('<a href="'+pic+'.htm"><img src="'+pic+'.jpg"></a>');
Проверка работоспособности (результат в консоли):
<body>
<div>Номер года:
<input id="checkyear" type="number" value="2022"></div>
<div>День года (число от 1 до 366):
<input id="checkday" type="number">
<button onclick="testday();">Проверить дату</button></div>
<button onclick="testyear();">Вся статистка за год</button>
(результат в консоли браузера)
<script>
var inp = document.getElementById("checkday");
inp.value = getDayOfYear();
function testday(){
console.log("Проверка " + inp.value + ":", random(+inp.value));
}
function testyear(){
var o = {};
for( var i=1; i<=56; i++ ) o[i] = NaN;
for( var i=1; i<=366; i++){
var pic = random(i);
o[pic] = o[pic] ? o[pic] + 1 : 1;
console.log("День "+i+": картинка "+pic);
}
console.log( "Сколько раз в "+document.getElementById("checkyear").value+" году каждая картинка будет появляться:", o );
}
function getDayOfYear() {
var now = new Date();
var start = new Date(now.getFullYear(), 0, 0);
var diff = (now - start) + ((start.getTimezoneOffset() - now.getTimezoneOffset()) * 60 * 1000);
var oneDay = 1000 * 60 * 60 * 24;
return Math.floor(diff / oneDay);
}
console.log('Day of year: ' + getDayOfYear());
function random(day) {
var year = +document.getElementById("checkyear").value;
var r0 = day * 33 + 85017801 + year;
var left = ((parseInt('01111111110000000000000000000000', 2) & r0) >>> 23);
var r1 = (r0 << 9 >>> 1) | left;
var right = ((parseInt('111111111', 2)) & r0) << 24 >>> 1;
var r2 = (r0 >>> 8) | right;
r0 = r1 + r2;
return 1 + ((Math.floor(r0 / 99) + day) % 56);
}
</script>
</body>
Последний раз редактировалось Белый шум, 21.11.2022 в 14:51.
|
|
|
|
