СКРИПТЫ
ТЕГИ:
php (322)
js (242)
html (146)
css (127)
html tags (62)
js tag (56)
jquery (42)
text (37)
js method (36)
php array (33)
js date (33)
form html (30)
fonts (30)
online (27)
link (26)
Показать еще :
ruweb.net (25)
foto (22)
php file (20)
atom (20)
forum (19)
input (18)
hosting (18)
svg (18)
php date (17)
board (16)
php time (16)
html book (16)
color (15)
js events (14)
js url (14)
js time (14)
img (13)
htaccess (13)
osclass (13)
info (13)
notepad (13)
select (13)
php path (12)
keyboard (12)
table (12)
знак (12)
php img (12)
dw block (12)
download (12)
jsphp (11)
form (11)
icon (11)
yandex (10)
js delete (10)
mouse (10)
hover (9)
dosite (8)
php url (7)
browser (7)
cookie (7)
comment (7)
php get (6)
iframe (6)
list (6)
canvas (6)
mysql (6)
click (6)
tag a (5)
adminka (5)
value (5)
reg.ru (5)
search (5)
js math (5)
mb (5)
chart (5)
ftp (5)
year (5)
heading (5)
js id (5)
нок (4)
php var (4)
xml (4)
scandir (4)
ssl (4)
week (4)
day (4)
base64 (4)
bbcode (4)
js form (4)
task (4)
month (4)
console (4)
symbols (4)
pages (4)
vk (4)
submit (4)
https (3)
numbers (3)
js post (3)
js hash (3)
money (3)
vs code (3)
domen (3)
куб (3)
line (3)
captcha (3)
ucoz (3)
padding (3)
js img (3)
js vars (2)
рся (2)
youtube (2)
video (2)
sitemap (2)
tag hr (2)
prompt (2)
arrows (2)
details (2)
seo (2)
height (2)
google (2)
qr kod (2)
counter (2)
typeof (2)
speed (1)
rutube (1)
windows (1)
game (1)
header (1)
smile (1)
archive (1)
cursor (1)
jino (1)
scroll (1)
нод (1)

Как сделать геометрический фон на сайт?

"Как сделать геометрический фон на сайт?" Найдено давно, в сети.
Когда-то хотел себе поставить вот такой геометрический сменяемый фон . Чтож... это время пришло!

Подробно о геометрическом фоне

  1. Геометрический фон(по умолчанию)
  2. Пример по умолчанию
    Скачать
  3. Геометрический фон(dwweb.ru)
  4. Подключение к сайту геометрического фона...

  1. Геометрический фон(по умолчанию)

    Смотрим геометрический фон по умолчанию.

    Для того, чтобы сделать такой геометрический фон на странице нам потребуется:

    css

    Нам потребуется css:

    jquery

    Еще нам потребуется подключить jquery

    jquery code

    Подключаем скрипт :

    Запускаем скрипт...

    <script>
    $(function() {
    materialBackground.start();
    });
    </script>

    Теперь... соберем всю страницу для геометрического фона:

    Код простой страницы для геометрического фона.

    <!DOCTYPE html>

    <html lang="ru">

    <head>

    <meta charset="UTF-8">

    <title>material_background_default</title>

    <script src="https://dwweb.ru/js/jquery-3.3.1.min.js"></script>

    <link rel="stylesheet" type="text/css" href="https://dwweb.ru/__a-data/__all_for_scripts/__examples/jquery/sluchaynyiy_geometricheskiy_fon/material-background-styles.css">

    </head>

    <body>

    <div id = "material-background"></div>

    <script src="https://dwweb.ru/__a-data/__all_for_scripts/__examples/jquery/sluchaynyiy_geometricheskiy_fon/material-background-scripts.js"></script>

    <script>

    $(function() {

    materialBackground.start();

    });

    </script>

    </body>

    </html>

    Скачать material_background_default:

    Скачать material_background_default


  2. Геометрический фон(dwweb.ru)

    Я немного решил позволить вольностей с полученным геометрическим фоном из интернета...

    Теперь... достаточно подключить два скрипта.

    Теперь... подключить jquery - вы можете даже не подключаться... можете брать данный скрипт с нашего сайта

    <script src="https://dwweb.ru/js/jquery-3.3.1.min.js"></script>

    Далее... нужно подключить лишь второй скрипт(аналогично, что и с первый скриптом... можете брать с нашего сайта.) :

    <script src="https://dwweb.ru/js/geometric_background_dw.js"></script>

    В скрипт добавлено плавное появление, см. class slowly

    Насыщенность заднего фона - "body:after" - сейчас "opacity: 0.8;"

    + блок "example" для примера текста...

    Соберем весь геометрически фону:

    <!DOCTYPE html>

    <html lang="ru">

    <head>

    <meta charset="UTF-8">

    <title>Пример веб-страницы</title>

    <script src="https://dwweb.ru/js/jquery-3.3.1.min.js"></script>

    <script src="https://dwweb.ru/js/geometric_background_dw.js"></script>

    <style>

    .example {

    font-family: system-ui;

    background: #8f8f8f59;

    color: white;

    text-align: center;

    position: absolute;

    top: 50%;

    left: 50%;

    width: 464px !important;

    height: 100px;

    border: 1px solid #747474;

    transform: translate(-50%,-50%);

    min-width: 320px;

    text-transform: uppercase;

    font-weight: 100;

    font-size: 30px;

    line-height: 94px;

    box-shadow: 0 10px 20px -5px rgb(0 0 0 / 40%);

    }

    </style>

    </head>

    <body>

    <div class="example">

    material-background

    </div>

    </body>

    </html>

    Результат геометрического заднего фона:

    Скачать текст_ссылки


  3. paragraph_material_background_on

    Подключение к сайту геометрического фона...

    Ну и давайте подключим "геометрический фон"(мой вариант) к странице прямо здесь:

    Некоторые блоки выглядят не очень, но ведь это всего лишь пример!

    Все тоже самое, что и во втором пункте.

    Как включать выключать геометрический фон?

    Сверху вы увидели, как включать/отключать "геометрический фон"... давайте разберем этот вариант...

    Опять нам надо ...подключить jquery

    Форма html :

    <form method="post">
    <input name="on" type="submit" value="Включить на всей странице" class="width_100">
    </form>

    <form method="post">
    <input name="off" type="submit" value="Отключить" class="width_100">
    </form>

    Php :

    В теге head

    <?
    if($_SESSION[background])
    {
    echo '<script src="https://dwweb.ru/js/geometric_background_dw.js"></script>';
    }
    ?>

    Php до тега <!DOCTYPE>

    <?
    function refresh(){ return (exit('<meta http-equiv="refresh" content="0; url=">'));}
    if ($_POST[on])
    {
    $_SESSION[background] =1; refresh();
    }

    if ($_POST[off])
    {
    $_SESSION[background] =''; refresh();
    }
    ?>

Можете не благодарить, лучше помогите!
Теги :
геометрический фон
Как сделать геометрический фон на сайт?
jquery background geometric
Еще никто не прокомментировал! COMMENTS+   BBcode
Подписаться + =

Счетчик в график :

Построение гравиков
Основа для графика : счетчик посещаемости.
На отдельной : странице.
dwweb.ru есть здесь:
Последние комментарии :
Марат :
14.03.2023 21:07
Так... это когда было то... в 2018 году... мне не нравится(не нравилось), как поиск по файлам... как-то коряво было…
подробнее.
Moubrey :
14.03.2023 20:52
Их там два можно поставить, еще и по бокам, а в них еще друге окна станут вкладками, обычный проводник и…
подробнее.
Марат :
26.02.2023 12:20
Спасибо за внимательность!
подробнее.
V :
26.02.2023 11:49
В массиве месяцев пропущен октябрь!
подробнее.
Марат :
02.02.2023 10:48
Я не знаю, что это ... Такое понятие - "определена"... я не понимаю, что такое... есть такая фигня в Js, там, бывают…
подробнее.
Артур :
02.02.2023 06:51
При копировании всего кода из 3 главы "Вывод всех файлов из папки ссылками на них", при выполнении скрипта…
подробнее.
ruweb
Страница загружена за : 0.020051 секунд. Подробнее