A Pen by Alexander Hadik

Developer
Alexander Hadik
Size
2,792 Kb
Views
20,240
  1. A Pen by Alexander Hadik Previews
  2. A Pen by Alexander Hadik HTML Codes
  3. A Pen by Alexander Hadik CSS Codes
  4. A Pen by Alexander Hadik JS Codes

How do I make an a pen by alexander hadik?

What is a a pen by alexander hadik? How do you make a a pen by alexander hadik? This script and codes were developed by Alexander Hadik on 16 September 2022, Friday.

A Pen by Alexander Hadik Previews
IQ Test

A Pen by Alexander Hadik - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Pen by Alexander Hadik</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="row">Data</div>
<div class="row">Data</div>
<div class="row">Data</div>
<div class="row">Data</div>
<div class="row">Data</div>
<div class="row">Data</div>
<div class="row">Data</div> <script src="js/index.js"></script>
</body>
</html>

A Pen by Alexander Hadik - Script Codes CSS Codes

body { font-family: sans-serif; width: 400px; margin-left: auto; margin-right: auto; margin-top: 36px; background: lightgrey; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center;
}
.row { background: white; width: 100%; border-bottom: 1px solid grey; border-top: 1px solid grey; height: 24px; padding: 6px; line-height: 24px; -webkit-transition: 0.5s all; transition: 0.5s all; margin-top: -1px; box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.4);
}
.row--pop { height: 36px; width: 150%; line-height: 36px; margin-top: -6px; margin-bottom: -6px; border-top: 1px solid grey; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4); z-index: 1;
}

A Pen by Alexander Hadik - Script Codes JS Codes

'use strict';
var rows = [].slice.call(document.querySelectorAll('.row'));
for (var _iterator = rows, _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) { var _ref; if (_isArray) { if (_i >= _iterator.length) break; _ref = _iterator[_i++]; } else { _i = _iterator.next(); if (_i.done) break; _ref = _i.value; } var row = _ref; row.addEventListener('click', function (event) { rows.forEach(function (row) { row.classList.remove('row--pop'); }); event.target.classList.add('row--pop'); });
};
A Pen by Alexander Hadik - Script Codes
A Pen by Alexander Hadik - Script Codes
Home Page Home
Developer Alexander Hadik
Username ahadik
Uploaded September 16, 2022
Rating 3
Size 2,792 Kb
Views 20,240
Do you need developer help for A Pen by Alexander Hadik?

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!

Alexander Hadik (ahadik) Script Codes
Name
Transcriptic Typography
Geometric Header
Pricing Table
Workcell
Basil Tree
Pricing Cards V2
Ops Implementation
Welcome to Transcriptic
HSL SVG Gradient
Transcriptic Node Graph
Create amazing love letters with AI!

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!