Главная » Языки программирования

Menu in menu css v34

Содержание
  1. 102 CSS Menu
  2. Table of Contents
  3. Related Articles
  4. Author
  5. Links
  6. Made with
  7. About a code
  8. Menu
  9. Author
  10. Links
  11. Made with
  12. About a code
  13. Fullscreen Overlay Navigation Bar
  14. Author
  15. Links
  16. Made with
  17. About a code
  18. Three Fancy Link Hover Effects
  19. Author
  20. Links
  21. Made with
  22. About a code
  23. Navigation Dotted Hover Effect
  24. Author
  25. Links
  26. Made with
  27. About a code
  28. Fullscreen Overlay Navigation Bar
  29. Author
  30. Links
  31. Made with
  32. About a code
  33. Context Menu
  34. Author
  35. Links
  36. Made with
  37. About a code
  38. Pure CSS Menu
  39. Author
  40. Links
  41. Made with
  42. About a code
  43. Neumorphism Context Menu
  44. Author
  45. Links
  46. Made with
  47. About a code
  48. Simple Navigation System
  49. Author
  50. Links
  51. Made with
  52. About a code
  53. CSS Menu
  54. Author
  55. Links
  56. Made with
  57. About a code
  58. Fullscreen Menu Enter
  59. Author
  60. Links
  61. Made with
  62. About a code
  63. Context Menu with Feather Icons
  64. Author
  65. Links
  66. Made with
  67. About a code
  68. CSS Hamburger Menu
  69. Author
  70. Links
  71. Made with
  72. About a code
  73. Text Fill on Hover
  74. Author
  75. Links
  76. Made with
  77. About a code
  78. List Item Hower Effect
  79. Author
  80. Links
  81. Made with
  82. About a code
  83. CSS-Only Marquee Effect
  84. Author
  85. Links
  86. Made with
  87. About a code
  88. CSS Full-Page Navigation
  89. Author
  90. Links
  91. Made with
  92. About a code
  93. Randomly Generated CSS Blobby Nav
  94. Author
  95. Links
  96. Made with
  97. About a code
  98. Full-Page Navigation
  99. Author
  100. Links
  101. Made with
  102. About a code
  103. Pure CSS Full Page Nav
  104. Author
  105. Links
  106. Made with
  107. About a code
  108. Fold Out Mobile Menu
  109. Author
  110. Links
  111. Made with
  112. About a code
  113. Menu Hover Fill Text
  114. Author
  115. Links
  116. Made with
  117. About a code
  118. Menu with Awesome Hover
  119. Author
  120. Links
  121. Made with
  122. About a code
  123. CSS Navigation Bar
  124. Author
  125. Links
  126. Made with
  127. About a code
  128. Menu Hover Underline
  129. Author
  130. Links
  131. Made with
  132. About a code
  133. Apple TV Menu Interface
  134. Author
  135. Links
  136. Made with
  137. About a code
  138. CSS Strange Nav
  139. Author
  140. Links
  141. Made with
  142. About a code
  143. Navbar with Pure CSS
  144. Author
  145. Links
  146. Made with
  147. About a code
  148. Navbar Interaction
  149. Author
  150. Links
  151. Made with
  152. About a code
  153. Off Canvas Menu Pure CSS
  154. Author
  155. Links
  156. Made with
  157. About a code
  158. Menu Bar CSS
  159. Author
  160. Links
  161. Made with
  162. About a code
  163. Vertical Dark Menu with CSS
  164. Author
  165. Links
  166. Made with
  167. About the code
  168. Moving Underline Nav Menu
  169. Author
  170. Links
  171. Author
  172. Links
  173. Made with
  174. About the code
  175. Navigation Menu
  176. Author
  177. Links
  178. Made with
  179. About the code
  180. 3D Navbar
  181. Author
  182. Links
  183. Made with
  184. About the code
  185. Just Another Menu
  186. Author
  187. Links
  188. Made with
  189. About the code
  190. Pure CSS Menu
  191. Author
  192. Links
  193. Made with
  194. About the code
  195. CSS Menu Feat. Emoji
  196. Author
  197. Links
  198. Made with
  199. About the code
  200. The Menu
  201. Author
  202. Links
  203. Made with
  204. About the code
  205. Menu Effect
  206. Author
  207. Links
  208. Made with
  209. About the code
  210. CSS-Only Nested Dropdown Navigation
  211. Full Page Off-Canvas Navigation
  212. Simple Radial Menu
  213. Accordion Menu
  214. Mobile Filter Menu
  215. Author
  216. Menu Creator 3.0.0.2
Читайте также:  Методы вывода в питоне

102 CSS Menu

Collection of free HTML and CSS navigation menu code examples. Update of May 2020 collection. 27 new items.

Table of Contents

Author

Made with

About a code

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Fullscreen Overlay Navigation Bar

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Transitioning clip-path and pseudo-element transform s to create smooth link hovers.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Fullscreen Overlay Navigation Bar

Fullscreen overlay navigation bar with html & css neon effect.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Context Menu

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Pure CSS Menu

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Neumorphism Context Menu

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Simple Navigation System

Simple system for navigating a hierarchy in a confined space. Uses standard HTML and CSS, no JavaScript.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

CSS Menu

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Fullscreen Menu Enter

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Context Menu with Feather Icons

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

CSS Hamburger Menu

Pure CSS menu interaction. Made using the HTML tags details and summary .

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Text Fill on Hover

Filling the text with a different color on hover — a creative text effect.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

List Item Hower Effect

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

CSS-Only Marquee Effect

A simple CSS-only marquee effect for a menu.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

CSS Full-Page Navigation

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Randomly Generated CSS Blobby Nav

A randomly generated blobby nav created with CSS. Has smooth anchor scrolling, uses backdrop-filter , and SVG filter.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Full-Page Navigation

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Pure CSS Full Page Nav

Compatible browsers: Chrome, Edge, Firefox (partial), Opera, Safari

Author

Made with

About a code

Fold Out Mobile Menu

CSS only fold out mobile menu.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Menu Hover Fill Text

Menu hover fill text ( color + background-clip ).

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Dependencies: bootstrap.css, bootstrap-social.css, font-awesome.css

Author

Made with

About a code

CSS Navigation Bar

Implemented a minimal navigation bar that changes color on hovering. Written using only HTML and SCSS.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Apple TV Menu Interface

Compatible browsers: Chrome, Edge, Opera, Safari

Author

Made with

About a code

CSS Strange Nav

Made a strange navigation. CSS only. Let’s Click!

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Off Canvas Menu Pure CSS

Off canvas menu pure CSS by using only CSS.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About a code

Vertical Dark Menu with CSS

Simple vertical dark menu with CSS and icons.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About the code

Moving Underline Nav Menu

Compatible browsers: Chrome, Firefox, Opera, Safari

Author

Author

Made with

About the code

Usable as navigation, menu or effect. It uses CSS transform and perspective to create a unique hololens-like animation effect.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About the code

3D Navbar

3D navbar in HTML and CSS.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About the code

Just Another Menu

Pure CSS floating menu animation.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About the code

Pure CSS Menu

Pure CSS menu drawer with off-click.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About the code

CSS Menu Feat. Emoji

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About the code

The Menu

Table contents style menu.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Author

Made with

About the code

Reverse text color menu effects.

Compatible browsers: Chrome, Firefox, Opera, Safari

Demo image: CSS-Only Nested Dropdown Navigation (ARIA)

Author

Made with

About the code

CSS-Only Nested Dropdown Navigation

CSS only nested dropdown navigation with ARIA.

Demo Image: Full Page Off-Canvas Navigation

Full Page Off-Canvas Navigation

An example of how to build a full page navigation that exists off of the screen canvas, sliding into view when clicking the menu option. Added spice with a changing background color depending on navigation item hover.
Made by Caleb Varoga
June 17, 2016

Demo Image: Simple Radial Menu

Simple Radial Menu

HTML, CSS, JavaScript simple radial menu with social icons.
Made by Nikolay Talanov
June 13, 2016

Demo Image: Simple accordion menu with HTML, CSS and JavaScript

Accordion Menu

Simple accordion menu with HTML, CSS and JavaScript.
Made by JuliaRietveld
June 8, 2016

Demo Image: Mobile Filter Menu

Mobile Filter Menu

Filter menu created by Anton Aheichanka that has been converted into web version.
Made by Arjun Amgain
June 1, 2016

Author

Источник

Описание:
Плагин позволяет создавать вам любые меню для вашего сервера, которые будут открываться по командам, которые вы зададите.

Установка плагина:
Извлечь архив в папку sourcemod/

Использование плагина:
Плагин создает меню на основе menu_creator.txt. Все команды выглядят как три блока, разделенные между собой вертикальным слешем (arg1|arg2|arg3).

Описание команд для создания меню:
Создание меню:
create|название меню|тип меню
название_меню для каждого меню должно быть уникальным
типы меню: menu — меню, panel — панель, list — список

Команда для открытия меню:
regcmd|команда|флаги доступа
команда — зависит от регистра
флаги доступа — не указывать, если команда должна работать и для простых игроков

Установка заглавия меню:
title|заглавие

Добавление пункта в меню:
item|отображаемый текст|действие при нажатии
действие при нажатии — ограничение 256 символов

Добавление текста в меню:
text|отображаемый текст

Добавить кнопку «назад»:
setback|название меню
название меню — меню, в которое возвращаться при нажатии на «назад»

Переместить позицию кнопки:
setpos|позиция
только для панелей, позволяет создать меню с отсутствующими цифрами (например, нажать можно будет на 1, 3, 6)

Время, которое будет открыто меню:
settime|время
время — в секундах

Команды плагина:
sm_mc_om — открыть меню для игрока
sm_mc_ourl — открыть url в motd для игрока
sm_mc_fc — выполнить команду от лица игрока

sm_mc_ol — открыть список для игрока
sm_mc_odl — открыть список с игроками для игрока, type — clients1, clients2 — индекс клиента, userids1, userids2 — юзерайди клиента, name1, name2 — имя клиента, alive — 0 = только мертвые, 1 — только живые, 2 — живые и мертвые, team — 0 = любая, 1 — спектраторы, 2 — т, 3 — кт, 4 — т и кт.

Алиасы:
— перенос на новую строку «\n»
— вертикальный слеш «|»
< >— пробел » «

— индекс клиента, нажимающего в меню
— юзерайди клиента, нажимающего в меню
— имя клиента, нажимающего в меню

для списков:
— первые кавычки
— вторые кавычки
— то, что выбрал клиент в этом списке

Консольные переменные плагина:
sm_mc_onpostadmin — команда, выполняемая клиентом при входе на сервер (если вам нужно открыть какое-то меню после входа игрока)

История изменений:
(23.07.2013) — выход версии 1.0.
(20.10.2013) — выход версии 2.0. Полностью переписан код, добавлена возможность вложения в панелях на любой уровень.
(21.10.2013) — выход версии 2.1. Изменен синтаксис, убран стандартный «exec» конфига, вместо этого добавлен свой парсер файла, перенесены настройки меню в другой файл, убраны команды созданий меню и их настроек (этим теперь занимается парсер на запуске плагина). Добавлена поддержка любых символов в тексте, командах (благодаря парсеру).
(20.06.2015) — выход версии 3.0.0.0. Перенос на новый синтаксис, добавлена поддержка списков, добавлена возможность выполнять разрешенные команды от лица игрока (например, say), добавлен конвар sm_mc_onpostadmin
(08.07.2015) — выход версии 3.0.0.1. Исправлена ошибка, когда на sm_mc_onpostadmin ставилось открытие панели, и потом при нажатии на элемент панели она просто закрывалась без всяких ошибок.

Примеры создания меню:
см. menu_creator.txt

Списки дают возможность вам «выслушать» мнение игрока, который его использует. Допустим, вы хотите дать игрокам возможность выбрать из меню приветствие игрока (см. menu_creator.txt, greetings меню). После выбора вы хотите, чтобы эту фразу от сказал от своего лица, и вернулся в предыдущее меню. Для этого открывается меню greetings, но уже через команду открытия списка sm_mc_ol. Затем выполняется команда sm_mc_fc «say и открытие меню sm_mc_om mainMenu. Так как в последнем действии две команды, их нужно разделить двоеточием. Для этого перед первой и второй командой нужно поставить (такие сложности связаны с ServerCommand() сурсмода). ставятся так же, как и , только когда вам нужно, чтобы выполнялось первый раз два+ действия, и затем еще раз 2+ действия. Тогда в этом случае ставится для первых действий, а — для вторых.
Пример использования sm_mc_odl схож с sm_mc_ol, только лишь с тем отличием, что вам не надо описывать меню, оно будет составлено автоматически плагином (будет динамическим, по завершению его использования хандл будет закрыт сам), и так же содержит по два одинаковых типа (на всякий случай).

P.S. Аналог плагина от wS Menu Creator, который он продает за 300 рублей теперь уже 100 рублей теперь уже бесплатно.

Администрация:
Данная тема в теге «оффтоп» обсуждется здесь

Источник

Оцените статью
© 2024 Программирование