Скрипт для сайта html – Тег HTML подключение скрипта

Содержание

HTML5 » Скрипты для сайтов

3 009 Скрипты / Form

Эффекты для текстовых полей

Несколько интересных эффектов для текстовых полей включающих некоторые новые методы реализации и идеи. В основном используются CSS transitions и изредка CSS animations на label тегах или на псевдо-элементах.

Эффекты для текстовых полей 2 545 Скрипты / Loading

Стилизация кнопки загрузки

Креативные кнопки выполняющие роль прогресс бара, отображающего ход выполнения, какого-либо действия требующего время.

Стилизация кнопки загрузки 8 723 Скрипты / Gallery

Адаптивная галерея least.js

Пришло время адаптивных сайтов, продолжаем эту тематику в галерее, одинаково хорошо отображаемой как на десктопе, так и на мобильных устройствах. В галерее используется плагин lazyload - отложенная загрузка картинок, который позволяет экономить трафик. При наведении курсора на изображение отображается краткое описание, а по клику происходит показ полной версии изображения. По умолчанию изображения формируются случайным образом на странице.

Адаптивная галерея least.js 5 019 Скрипты / Menu & Nav

Адаптивное многоуровневое меню

Экспериментальное меню позволяющее с экономить пространство на вашем сайте, где требуется использование много уровневого меню. "Детки" заменяют собой "родителей" не загромождая страницу. Меню можно устанавливать на страницы с адаптивным дизайном.

Адаптивное многоуровневое меню 3 327 Скрипты / Menu & Nav

Адаптивное Retina меню

Красочное адаптивное меню с поддержкой Retina дисплеев. В зависимости от размера окна браузера меню принимает один из трех видов: для десктопов - обычное горизонтальное отображение, двухколоночное для планшетов и мобильная версия ввиде иконки-ссылки для отображения и скрытия пунктов меню на экранах небольших размеров. Для поддержки Retina используются иконки ввиде шрифта, а не ввиде картинок, таким образом мы избегаем пикселизации при изменении размера.

Адаптивное Retina меню 2 196 Скрипты / Menu & Nav

Размытое меню на CSS3

Простое горизонтальное меню с эффектом размытия и с элементом адаптивности. Используется CSS3 и HTML5.

Размытое меню на CSS3 3 810 Скрипты / Form

Стильная форма регистрации на CSS3

Простая и стильная регистрационная форма для сайта. Для её работы требуется jQuery и плагин placeholder.

Стильная форма регистрации на CSS3 1 838 Полезно

HTML5 Boilerplate

«Самый популярный фронтенд шаблон» - или как было написано раньше - это HTML/CSS/JS шаблон для всех маньяков, пишущих быстрые, неглючные и ориентированные на будущее сайты.

HTML5 Boilerplate 1 469 Скрипты / Social Media

Круглое социальное меню

Сделаем круглое социальное меню в котором не используются изображения. Иконки социальных сервисов берутся из специального шрифта.

Круглое социальное меню 4 854 Скрипты / Slider

Turn.js - перелистывание страниц

Turn.js плагин добавляющий эффект похожий на перелистывание страниц в книгах для HTML5. Используется аппаратное ускорение. Работает на планшетах и смартфонах. Прост в управлении и весит всего 6Kb.

Turn.js - перелистывание страниц 943 Скрипты / Other

Кисть с эффектом кривой Безье

Создадим ещё одну кисть, теперь уже с эффектом кривой Безье, для созданной нами ранее paint программы.

Кисть с эффектом кривой Безье 731 Скрипты / Other

Bubble кисть для Paint программы

Сейчас сделаем bubble кисть для созданной в прошлой статье paint программы на html5.

Bubble кисть для Paint программы
  • Назад
  • 1
  • 2
  • Вперёд

Скрипты для сайтов » Страница 3

837 Codepen

Curl noise

Пример curl noise с элементами в виде коробок. Используются шейдеры и webGL библиотека Kgl

Curl noise 1 026 Codepen

Глубокий фрактальный зум

Три разновидности фрактала. При перемещении курсора мы либо погружаемся, либо всплываем. Для эффектов используются шейдеры.

Глубокий фрактальный зум
835 Codepen

Клянусь Богом, я не пьян!

Три одинаковых изображения накладываются друг на друга образуя интересный эффект. При движении курсора, меняется положение изображений, создавая дополнительный объем.

Клянусь Богом, я не пьян! 591 Codepen

Фрактальные круги

Случайно генерируемые круги

Фрактальные круги 473 Codepen

Носорог

Носорог

Носорог 472 Codepen

Линейный фрактал

Анимация линейного фрактала на канвасе

Линейный фрактал 758 Codepen

Сверкающие звезды

Космос с сияющими звездами на канвасе и шейдерах

Сверкающие звезды 577 Codepen

Свинья-копилка

Анимация svg свиньи копилки с помощью GSAP tweenmax

Свинья-копилка 977 Codepen

Неоновые огни

Неоновые огни на канвасе с помощью шейдеров. Неоновое сердце и знак бесконечности

Неоновые огни 632 Codepen

Одуванчик

Одуванчик на канвасе. Реагирует на движение курсора.

Одуванчик 622 Codepen

Долгий путь

Бесконечный цикл из простейших геометрических фигур расположенных по заданной траектории. Перемещаясь вместе с камерой, пролетаем через каждую фигуру.

Долгий путь 743 Codepen

Ночь, улица, фонарь... шейдеры

Эксперимент с шейдерами. Мелькающий свет фонарей и машин сквозь окно в дождливую ночь... воображение достраивает примерно такую картину. Реализовано с помощью three.js и tweenmax

Ночь, улица, фонарь... шейдеры

Скрипты для сайтов » Страница 4

965 Form / Codepen

Резиновый ползунок или range slider

Range slider с эффектом резиновости реализованном с помощью gsap tweenmax.

Резиновый ползунок или range slider 1 061 Text / Codepen

Жидкий текст при наведении

При hover на текст его фон становится текучим, как жидкость.

Жидкий текст при наведении
966 Codepen

Разлетающиеся на осколки изображения

Слайдер изображений, которые при клике разлетаются на осколки с плавной анимацией реализованной на GSAP.

Разлетающиеся на осколки изображения 798 Codepen

Красочный мир турбулентности

Разноцветные частицы закручиваются в одну или несколько спиралей на канвасе. По клику генерируется новая случайная картинка.

Красочный мир турбулентности 940 Codepen

Рассеивающиеся шестиугольники

Рассеивающиеся шестиугольники по канвасу на jаvascript

Рассеивающиеся шестиугольники 859 Codepen

Солнечные лучи

Солнечные лучи на изображении. При движении изображения создается эффект прохождения лучей сквозь листву дерева. Сделано с использованием шейдеров и jаvascript

Солнечные лучи 786 Codepen

Энергия

Энергетические лучи следующие за курсором. Написано на JS на canvas

Энергия 1 347 Codepen

Волна из частиц

Волна на canvas из летящих частиц

Волна из частиц 891 Codepen

Бегущая лошадь на CSS

Реализованная на CSS бегущая лошадь.

Бегущая лошадь на CSS 1 255 Codepen

Текстурный переход между изображениями на three.js

При наведении на картинку происходит плавный переход сквозь текстуру для показа другой картинки. При движении курсора мыши так же происходит наклон в 3d пространстве. Реализовано на three.js

Текстурный переход между изображениями на three.js 1 322 Codepen

Космическая стрелялка, игра на js

Срелялка на jаvascript. Вы соревнуетесь с компьютером в то, кто кого быстрее подстрелит. Осложняют ситуацию летающие астеройды.

Космическая стрелялка, игра на js 1 134 Text / Codepen

Гибкий текст

Немного css магии font-variation-settings, -webkit-background-clip, -webkit-text-fill-color приправленной js и прикольный эффект над текстом.

Гибкий текст

Скрипт голосования для сайта

голосование на сайтеСкрипт голосования для сайта написан на PHP с применением ява скриптов AJAX и легко интегрируется на html страницы. Голосование и вывод показателей в скрипте происходит без перезагрузки страницы, и для каждого IP адреса голосовать можно только 1 раз в сутки.

Это универсальный скрипт голосования может работать как без Базы данных, так и взаимодействовать с ней. В последнем варианте это необходимо, когда у вас на сайте применяется регистрация пользователей.

Я вам привожу в пример три варианта скрипта, из которых вы сами выберите, какой установить к себе на сайт.

Первый вариант скрипта голосования показывает сколько проголосовавших всего, выводит на экран сумму голосов, и имеет две кнопки "Понравилось" и "Не понравилось".

Второй вариант почти такой же, только вместо вывода общего числа проголосовавших, он показывает сколько посетителей проголосовало "за", и сколько "против".

Третий вариант самый упрощённый вариант, и здесь отсутствуют кнопки "за" и "против", здесь нет вывода общего числа голосовавших, здесь есть одна кнопка, которая фиксирует, что пользователю понравилось и суммарное число выводится на дисплей формы. И кстати, эта форма имеет соответственно самый маленький размер, что так же является её достоинством.

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

Код для *.html

<!DOCTYPE html>
<html>
<head>
  <link href="votingfiles/voting.css" rel="stylesheet" type="text/css" />
  <script src="votingfiles/voting.js" type="text/jаvascript"></script>
</head>
  <body>
                <!-- Первый вариант -->
    <div></div>
    
                <!-- Второй вариант -->
    <div></div>
    
                <!-- Третий вариант -->
    <div></div>
  </body>
</html>

Для того, чтобы формы голосования на всех ваших страницах работали от одного скрипта, нужно на каждой странице в коде (выше) сделать одно изменение.
А именно здесь: изменяете только вторую часть после vt_. Придумывать можно абсолютно любые имена, только латиницей разумеется, и так для каждой страницы - своё имя. Всё, изменений больше делать никаких не нужно, кроме того, что если изменить оформление в стилевом файле, и заменить в скрипте латиницу на русские слова.

Все данные о пользователях, "скрипт голосования" хранит в текстовом файле, а кому нужно будет подключить Базу данных MySQL (о чём писал выше), тот найдёт инструкцию с указаниями, как это сделать (прилагается в архиве).

На этом всё, кому понравилась статья о скрипте голосования, нажимаем на Лайки и пишем комментарии!

голосование на сайте

стрелка вниз Скачать скрипт голосования для сайта

Дата публикации: 30.08.2018

Похожие статьи

Станислав

16 мая 2019 18:47

Станислав

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

Добавить комментарий

Скрипты для сайта

Responsive FlipBook jQuery — скрипт журнала/книжки для сайта FlipBook jQuery 1.6 Скрипты для сайта

Responsive FlipBook jQuery — один из лучших своего рода скриптов для организации журнала, брошюры или книжки-каталога на сайте. Скрипт разработан с помощью jQuery c эффектом перелистывания страниц, что выглядит очень красиво и привлекательно. Пример такого скрипта можно посмотреть на сайтах популярных брендов: oriflame, avon и т.д.

Скрипт онлайн чата для любого сайт на PHP (WordPress, Joomla, Drupal, OpenCart,…) Скрипты для сайта

Универсальный скрипт онлайн чата, который подойдет для любого сайта, в том числе и для популярных CMS: WordPress, Joomla, Drupal, OpenCart и других, работающих на PHP и MySQL.

Простой скрипт доски объявлений о работе (вакансии и резюме). Скрипты для сайта

Пример работы

С помощью скрипта доски объявлений о работе можно создать простую поисковую базу данных рабочих мест. Пользователи могут зарегистрироваться/авторизоваться с помощью социально сети facebook или твиттера.

Скрипт полностью настраиваемый, Вы может создавать любые типы и категории полей, запросов и форм (график работы, полные или не полный рабочий день, категории вакансий и т.д.)

Особенности скрипта:

  • авторизация через соц.сети
  • форма поиска
  • страница список пользователей
  • пользователи могут редактировать свои профили
  • управление правами на группы пользователям
  • уведомления по почте
Geo Locator v.0.1 — скрипт для определения IP и местоположения. Скрипты для сайта

Пример работы

Geo Locator — Мультиязычный (присутствует поддержка русского языка) скрипт, который выводит информацию по заданному IP адресу или по имени хоста (название сайта). Данный скрипт разработан на основе Google Maps и Maxmind GeoIP.

Чистый и современный дизайн. Код полностью написан на XHTML и CSS, что не составит труда внести изменения и использовать данный скрипт на своем сайте в определенной форме или на отдельной странице.

3D Аккордеон меню — скрипт (CSS3 и HTML5) Скрипты для сайта

  

Пример работы

Это чистый скрипт 3D аккордеон меню, выполненный на CSS3 и HTML5 с эффектами анимации. Скрипт легко настроить и персонализировать под свой стиль.

Особенности скрипта:

  • чистый код
  • поддержка iOS систем
  • 42 цветовых стиля
  • 3D эффекты вращения
  • 6 эффектов анимации
Paid4Upload — php скрипт файлового хостинга Скрипты для сайта

Хотите организовать на свое сайте что-то вроде файлообменной сети или создать полностью специализированный сайт файлового хостинга, тогда скрипт Paid4Upload, написанный полностью на PHP, вам обязательно подойдет.

Sitemap Generator Pro v6.0 — PHP скрипт карты сайта Скрипты для сайта

Всем известно что карта сайта является неотъемлемой составляющей для улучшения показателей поисковой оптимизации (SEO) нашего сайта. С помощью карты сайта поисковикам проще отслеживать изменение информации на вашем сайте, что приводит к более быстрому индексированию сайта.

Sitemap Generator Pro — является простым и легким в установке PHP скриптом.

Особенности плагина:

  • никаких ограничении во вложенности и кол-ву страниц
  • скрипт может генерировать:
    — XML карту сайта
    — HTML карту сайта
    — Карту сайта изображений, виде, новостей
    — Карту сайта для мобильных устройств
  • дополнительные поля для описании теста и изображении
  • быстрая и легкая установка
  • Авто-пинг для поисковых систем
WheEllipse — интерактивный скрипт социальных закладок Скрипты для сайта

Пример работы

WheEllipse — это уникальный плагин, разработанный на библиотеках jQuery, с помощью которого Вы можете создать несколько интерактивных социальных закладок с эффектом вращения по окружности или по форме эллипса.

Таблица тарифов и цен на CSS3 и jQuery Скрипты для сайта

  

Пример работы

Особенности скрипта:

  • Быстрый и функциональный
  • Эффекты и анимация выполнены на CSS3 и jQuery
  • 8 цветовых стилей и 29 эффектов анимации
  • Дополнительный стиль анимации каждой строки, вы можете определить глобальные анимации и настраивать каждую строку
  • В архиве документация, исходники, скриншоты и PNG

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *