Ru-Board.club
← Вернуться в раздел «Графика»

» Как вставить скрипт фонового эффекта воды на форум ???

Автор: hd78
Дата сообщения: 10.09.2015 13:05
Уважаемые вебмастера подскажите пожалуйста чайнику простыми словами.
Как вставить скрипт фонового эффекта воды указанный на этом сайте

Есть ли вообще возможность установления этого фона на форумах borda с доменом forum24.ru ???
На форуме техподдержки указанного ресурса что то спрашивать к сожалению бесполезно.
Имеется сайт на ucoz.ru куда могу залить файлы. Насколько я понимаю на сайте нужно создать папку и закачать в неё файлы скачанные по указанной выше ссылке. Это я сделал а на то что указано далее по установке скрипта у меня не хватает тяму. Не пойму куда вставлять ссылку на forum24.ru на закачанные на ucoz.ru файлы или куда её добавить ? Может ссылку надо добавить url фонового рисунка в <body style="background:url(http://... ???
В пункте №2 по подключению скрипта насколько я понимаю нужно скопировать код:

Код: link media="screen" href="css/water.css" type="text/css" rel="stylesheet" />
Автор: Mavrikii
Дата сообщения: 10.09.2015 20:11
hd78
каким местом графика относится к вебмастерам?


Цитата:
А вот оставшиеся файлы не пойму - куда вставлять н них ссылки в скрипте ???

из всех "оставшихся" вам нужен только bg2.jpg, который должен идти фоном

Цитата:
background:url(http://фото.jpg)




Цитата:
скажите пожалуйста простыми словами как подключить этот javascript код ?

явно же сказано

Цитата:
Вставить куда угодно (по феншую между <body> и </body>)
Автор: hd78
Дата сообщения: 10.09.2015 20:43
Mavrikii

Цитата:
каким местом графика относится к вебмастерам?

Как то примерно так:



Подскажите тогда в каком разделе форума спросить ? Напишу там вопрос со ссылкой на эту тему.


Цитата:
из всех "оставшихся" вам нужен только bg2.jpg, который должен идти фоном

Дак я вставил его сюда background:url(http://фото.jpg) - фон есть но он неподвижный.
Разве нужен только файл bg2.jpg ? А как же выделенное ниже ???

Код: <link media="screen" href="css/water.css" type="text/css" rel="stylesheet" />

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.ripples.js"></script>
Автор: Mavrikii
Дата сообщения: 10.09.2015 20:49
hd78

Цитата:
Подскажите тогда в каком разделе форума спросить ?

выше же есть - помощь вебмастеру )


Цитата:
фон есть но он неподвижный.

значит проблема в чем то еще - нужно смотреть консоль ошибок браузера на наличие сообщений.


Цитата:
Разве нужен только файл bg2.jpg ? А как же выделенное ниже

вы же сказали, что вставили и выделенное ниже? вставляется между тегами <head> и </head> путь лучше делать от корня сайта, то есть /путь_к_папке_с_файлом/jquery.js и остальное аналогично.

да, там еще требование есть )) используется HTML5 (канвас), так что у страницы должен быть правильный DOCTYPE, иначе не будет работать.
http://htmlbook.ru/html/!doctype
Автор: hd78
Дата сообщения: 10.09.2015 22:29
Всё так и сделал с файлами и в шапку html поставил <!DOCTYPE html>
С отладчиком в браузере у меня туговато - надо разбираться.
Нашёл ещё сайт с таким же фоновым эффектом и там в комментариях пишут что тоже ни у кого не получается вставить чтобы этот фон работал.
Может есть ещё какие нюансы о которых я не в курсе ?
Автор: Mavrikii
Дата сообщения: 10.09.2015 22:53
hd78

Цитата:
Может есть ещё какие нюансы о которых я не в курсе ?

ссылку дайте и посмотрим в чем проблема.

ps: там, на самом деле, есть еще особенность. сервер, откуда скачивается картинка, должен выдавать кое что в заголовках, чтобы js скрипт мог забрать картинку и модифицировать

Цитата:
Image from origin 'http://***' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

или картинка должна быть в том же домене, что и скрипт
Автор: hd78
Дата сообщения: 10.09.2015 23:07
Delete Х
Автор: Mavrikii
Дата сообщения: 10.09.2015 23:11
hd78
что я и писал выше

Цитата:
Image from origin 'http://vu67.ucoz.ru' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://hyundaitruckclub.forum24.ru' is therefore not allowed access.


ps: мой совет, не вставляйте это в фон, это гадость, которая не нужна на форуме вообще.
Автор: hd78
Дата сообщения: 10.09.2015 23:24
Вроде прикольный фон - хотел попробовать поставить и посмотреть что получится.
А по существу вопроса, перевёл в translate.google но не понял что и чего запрещает ?
На форуме в настройках есть графа - Адрес папки с http, где лежат кнопки и иконки.
Кнопки и иконки грузил на тот же сайт и они работают на форуме.
Почему тогда и что блокируется с фоном ? Хотя ведь сама картинка фона присутствует.
Автор: Mavrikii
Дата сообщения: 10.09.2015 23:26
hd78

Цитата:
Почему тогда и что блокируется с фоном, хотя сама картинка фона присутствует.

потому, что javascript пытается самостоятельно загрузить картинку для математических операций над ней (волны эти). в заголовках ответа сервера (так как страничка грузится с другого домена) нет опции разрешающей скрипту загружать картинку, вот он и отказывается работать. нужно либо чтобы сервер имел в заголовках ответа эту опцию (от вас не зависит в данной ситуации), либо чтобы картинка грузилась с hyundaitruckclub.*, а не с vu67.*

вот тут проблема

Цитата:
style="background:url(http://vu67.ucoz.ru/voda_na_forume/bg2.jpg)

Автор: hd78
Дата сообщения: 10.09.2015 23:34
Странно, а почему тогда например работал скрипт снежинок ?
Вот его код, который вставлялся после <head>

Код: <script language="javascript" src="http://exiterra.ru/promo/snow/rem.js"//снег - 1></script>
<script>num_page = 20; no = Check(num_page); </script>
<script language="javascript" src="http://exiterra.ru/promo/snow/snow.js"//снег - 1></script>
Автор: Mavrikii
Дата сообщения: 11.09.2015 00:02
hd78

Цитата:
а почему тогда например работал скрипт снежинок

потому что другой js код, не использует возможности html5 и канваса.
канвас позволяет делать операции над картинками, в данном случае создаются волны.
снежинки же обычные плавающие элементы с неизменяемыми картинками, ничего такого.
Автор: hd78
Дата сообщения: 11.09.2015 00:05
Понятно. И ещё странность для меня, открываю файл фона под названием water.css
А в нём следующее:

Код: * { margin: 0; padding: 0; }
html {
    height: 100%;
}
body {
    color: #fff;
    background-image: url(../img/bg2.jpg);
    height: 100%;
    text-align: center;
}
Автор: Mavrikii
Дата сообщения: 11.09.2015 00:12
hd78

Цитата:
так и должно быть или туда нужно вставить ссылку

нужно вставлять. этого, собственно, и хватит вместо прямого прописывания у тега body


Цитата:
Пробовал вставлять туда ссылку на этот файл но без результата.

эта ссылка повлияет только на то, что будет фоном у тега body.
проблема с работой js кода. и, снова говорю, не создавайте безвкусицу.
я тоже, когда только изучал html и css дцать лет назад лепил все подряд, это лишь портит страницу, нагружает браузер, ухудшает взаимодействие с сайтом.
Автор: hd78
Дата сообщения: 11.09.2015 11:56
Mavrikii спасибо, действительно фон не подходящий - не буду заморачиваться.

Страницы: 1

Предыдущая тема: Anime Studio Pro

Форум Ru-Board.club — поднят 15-09-2016 числа. Цель - сохранить наследие старого Ru-Board, истории становления российского интернета. Сделано для людей.