VD Modal Sample
How do I make an vd modal sample?
What is a vd modal sample? How do you make a vd modal sample? This script and codes were developed by Jota Teles on 03 September 2022, Saturday.
VD Modal Sample - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>VD Modal Sample</title> <link rel='stylesheet prefetch' href='https://vivadecora.github.io/vd-modal/dist/css/vd-modal.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div ng-app="aplicativoExemplo">
<div ng-controller="indexController as vc">
<header> <h1> <span class="header-subtitile">VD Modal</span> <p class="header-title">Easy to use angularJs modal. </p> </h1>
</header>
<main> <button ng-click="vc.oi()">Exibe/Esconde modal "Olá mundo"</button>
<button ng-click="vc.toggleModalComColunas()">Exibe/Esconde modal com colunas</button>
</main> </div></div> <script src='https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js'></script>
<script src='https://vivadecora.github.io/vd-modal/dist/js/vd-modal.min.js'></script> <script src="js/index.js"></script>
</body>
</html>
VD Modal Sample - Script Codes CSS Codes
@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);
@import url(http://weloveiconfonts.com/api/?family=fontawesome);
/* fontawesome */
[class*="fontawesome-"]:before { font-family: "FontAwesome", sans-serif; font-style: normal; }
header h1 { font-family: Montserrat, "sans-serif"; font-size: 45px; text-align: center; line-height: 1; margin-bottom: 10px; color: #1a6090; } header h1 .header-subtitile { font-size: 0.35em; margin-bottom: 5px; position: relative; } header h1 .header-subtitile:before, header h1 .header-subtitile:after { content: ""; position: absolute; width: 25%; height: 2px; top: 50%; margin-top: -1px; background-color: #1a6090; } header h1 .header-subtitile:before { left: -35%; } header h1 .header-subtitile:after { right: -35%; } header h1 .header-title { margin-top: 10px; margin-bottom: 20px; text-shadow: 1px 1px #8cc4ea; }
body { background-color: #3598dB; color: #fff; }
*,
*::before,
*::after { box-sizing: border-box; }
input { display: none; }
VD Modal Sample - Script Codes JS Codes
angular.module("aplicativoExemplo", ["vd-modal"]); angular.module("aplicativoExemplo").controller("indexController", IndexController); function IndexController(ModalModel){ var vc = this; vc.modalOlaMundo = new ModalModel.getConstructor("ola-mundo"); vc.toggleModalOlaMundo = function(){ vc.modalOlaMundo.isOpen = !vc.modalOlaMundo.isOpen; } vc.modalComColunas = new ModalModel.getConstructor("modal-com-colunas"); vc.modalComColunas.isFullscreen = true; vc.toggleModalComColunas = function(){ vc.modalComColunas.isOpen = !vc.modalComColunas.isOpen; } }
Developer | Jota Teles |
Username | teles |
Uploaded | September 03, 2022 |
Rating | 3 |
Size | 2,498 Kb |
Views | 20,240 |
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Name | Size |
Teste do Staticman | 1,377 Kb |
Link Builder Examples | 2,948 Kb |
Angular link builder | 2,186 Kb |
Infinite chocolate bar | 4,634 Kb |
Popover | 2,248 Kb |
Parallel park - pure css | 8,404 Kb |
Nes palette components | 3,850 Kb |
ArrayMixer Playground | 3,677 Kb |
ArrayMixer | 3,053 Kb |
Markpad | 2,015 Kb |
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Name | Username | Size |
A Pen by utcwebdev | Utcwebdev | 2,856 Kb |
Responsive Pricing Table | Jeremycaris | 2,690 Kb |
Navier Stoke Fluid Simulation | Esimov | 8,584 Kb |
Voting App - register | MatheusLima92 | 1,948 Kb |
The Monty Hall Problem | Melatonind | 4,360 Kb |
A Pen by Final Boss tommyb9 | FBtommyb9 | 55,354 Kb |
Flower expansion | Sreucherand | 3,425 Kb |
CSS Hover Effects | Alen | 3,613 Kb |
Highbrow Basic HTML Lesson 8 | Kimlarocca | 2,094 Kb |
Css color for svg | Ademilter | 2,392 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!