47 lines
1.7 KiB
HTML
47 lines
1.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" class="no-js">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Fullscreen Form Interface</title>
|
|
<meta name="description" content="Fullscreen Form Interface: A distraction-free form concept with fancy animations" />
|
|
<meta name="keywords" content="fullscreen form, css animations, distraction-free, web design" />
|
|
<meta name="author" content="Codrops" />
|
|
<link rel="shortcut icon" href="../favicon.ico">
|
|
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
|
|
<link rel="stylesheet" type="text/css" href="css/demo.css" />
|
|
<link rel="stylesheet" type="text/css" href="css/component.css" />
|
|
<link rel="stylesheet" type="text/css" href="css/cs-select.css" />
|
|
<link rel="stylesheet" type="text/css" href="css/cs-skin-boxes.css" />
|
|
<script src="js/modernizr.custom.js"></script>
|
|
</head>
|
|
<body>
|
|
|
|
<script src="js/createResult.js"></script>
|
|
<script src="js/classie.js"></script>
|
|
<script src="js/classie.js"></script>
|
|
<script src="js/selectFx.js"></script>
|
|
<script src="js/fullscreenForm.js"></script>
|
|
<script>
|
|
(function() {
|
|
var formWrap = document.getElementById( 'fs-form-wrap' );
|
|
|
|
[].slice.call( document.querySelectorAll( 'select.cs-select' ) ).forEach( function(el) {
|
|
new SelectFx( el, {
|
|
stickyPlaceholder: false,
|
|
onChange: function(val){
|
|
document.querySelector('span.cs-placeholder').style.backgroundColor = val;
|
|
}
|
|
});
|
|
} );
|
|
|
|
new FForm( formWrap, {
|
|
onReview : function() {
|
|
classie.add( document.body, 'overview' ); // for demo purposes only
|
|
}
|
|
} );
|
|
})();
|
|
</script>
|
|
</body>
|
|
</html> |