Главная / Каталог скриптов для uCoz / Разное

Случайный цвет при обновлении страницы

Добавлено 18-02-2022 в 14:52

Категория Разное
Авторwaak
Просмотры298
Комментарии0
Понравилось7

Здравствуйте! Сегодня приведу пример как с помощью не большого скрипта jquery
сделать смену цвета у элементов при обновлении страницы в случайном порядке.

пример в картинках

первый вариант до обновления

После того как обновил страницу

обновили ещё раз

Для примера я возьму три блока и для каждого изменю что то одно ( цвет текста - цвет border - цвет background ) почему три? все просто что бы показать на примере как менять разные параметри для разных элементов

Пример скрипта

Код

$(document).ready(function () {
  var back = ["#f7a621","#FBB99C","#2E96DE","#ACC4FB","#EDA8C1"];
  var rand = back[Math.floor(Math.random() * back.length)];
  $('.waakbg').css('background',rand);
  $('.waakcolor').css('color',rand);
  $('.waakborder').css('border-color',rand);
})

скрипт подключаем в head на нужной страницы

Не много о скрипте
после того как мы подключили скрипт на страницу нам стали доступны три класса которые отвечают за смену одного из трёх параметров

1 .waakbg - Меняет цвет фона элемента
2 .waakcolor - Меняет цвет текста у элемента
3 .waakborder - Меняет цвет бордера

Теперь берём подходящий класс и просто прописуем его к элементу у которого будет меняться цвет текста фон или бордер

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

Что бы поменять или дополнить список цветов вам нужно просто изменить данную строчку так как именно она содержит перечень цветов которые будут применятся

Код

var back = ["#f7a621","#FBB99C","#2E96DE","#ACC4FB","#EDA8C1"];

Если что то не понятно или не получается пишите об этом в комментариях и мы вместе разберёмся!

Оставить комментарий

Добавлять комментарии могут только зарегистрированные пользователи.

Регистрация Вход

Создать сайт
Бесплатно

Меню

Полезно

Комментарии

pa patali2k

Спасибо большое!

06-06-2025 в 05:58 материал

waak

на все страницы вывести можно скриптом через запрос на персональную страницу пользователя а на странице со списком закладок я вывел так

Код

У вас $NUM_ENTRIES$ заклад<?if($NUM_ENTRIES$%10=0||$NUM_ENTRIES$%10>4||$NUM_ENTRIES$%100>10&&$NUM_ENTRIES$%100<15)?>ок<?else?><?if($NUM_ENTRIES$%10=1)?>ка<?else?>ки<?endif?><?endif?>

05-06-2025 в 22:07 материал

pa patali2k

Добрый день! Waak подскажи как вы сделали У вас N закладок, у меня выходит 1-5 например, так если можете подскажите как вывести кол.во закладок пользователя например в мини профиль, чтоб кол.во закладок показывало на любой странице

04-06-2025 в 16:51 материал

pa patali2k

Добрый день!
Сегодня снова попробовал установить скрипт и он снова не заработал, все перерыл, изменял, убирал и никак не заводился.
Решение: В общих настройках сайта нужно переключить Версия библиотеки jQuery: на jquery-1.12.4.min.js
В общем теперь просьба, не могли бы переписать скрипт закладок под jquery-3.6.0.min.js