A Pen by Daniel Grant

Developer
Daniel Grant
Size
2,464 Kb
Views
6,072
  1. A Pen by Daniel Grant Previews
  2. A Pen by Daniel Grant HTML Codes
  3. A Pen by Daniel Grant CSS Codes
  4. A Pen by Daniel Grant JS Codes

How do I make an a pen by daniel grant?

What is a a pen by daniel grant? How do you make a a pen by daniel grant? This script and codes were developed by Daniel Grant on 28 December 2022, Wednesday.

A Pen by Daniel Grant Previews
IQ Test

A Pen by Daniel Grant - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Pen by Daniel Grant</title> <style> /* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */ .container,
.card { width: 500px; height: 250px;
}
.container { display: table; transform-style: preserve-3d; transition: 0.5s;
}
.container.flipY { transform: rotateY(180deg);
}
.card { position: absolute; backface-visibility: hidden;
}
.card--front { background: red;
}
.card--back { background: green; transform: rotateY(180deg);
} </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
</head>
<body> <p>In Firefox Win, setting display: table breaks transform-style: preserve-3d on the same element</p>
<div class="container"> <div class="card card--front"></div> <div class="card card--back"></div>
</div>
<p>Bug raised at https://bugzilla.mozilla.org/show_bug.cgi?id=928322</p> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

A Pen by Daniel Grant - Script Codes CSS Codes

.container,
.card { width: 500px; height: 250px;
}
.container { display: table; transform-style: preserve-3d; transition: 0.5s;
}
.container.flipY { transform: rotateY(180deg);
}
.card { position: absolute; backface-visibility: hidden;
}
.card--front { background: red;
}
.card--back { background: green; transform: rotateY(180deg);
}

A Pen by Daniel Grant - Script Codes JS Codes

document.addEventListener('click', function() { document.querySelector('.container').classList.toggle('flipY');
});
A Pen by Daniel Grant - Script Codes
A Pen by Daniel Grant - Script Codes
Home Page Home
Developer Daniel Grant
Username djgrant
Uploaded December 28, 2022
Rating 3
Size 2,464 Kb
Views 6,072
Do you need developer help for A Pen by Daniel Grant?

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!

Daniel Grant (djgrant) Script Codes
Name
Grid crosshairs
Number input with controls
Wireframe Planet
Gradient Border
Touch rem
Responsive Modal
Transitioning application screens with semantically named classes
Zero element inline validation bubble
CSS triangles with border
Responsive Tabs
Create amazing blog posts 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!