kristalljunge
Mitglied
Hi Leute,
ich hab seitdem ich codepen.io für mich entdeckt hab immer wieder das "Problem", dass ich HTML, CSS und JS wie dort vorgegeben (meiner Meinung nach) richtig in meine HTML-Datei schreibe, der Effekt aber nicht erzeugt wird. Zur Verdeutlichung hier zwei Codepens, die ich wohl nicht richtig nutze:
- http://codepen.io/team/nclud/pen/MwaGGE
- http://codepen.io/noahblon/pen/wKvvxX
Bei dem ersten Code habe ich zum Test CSS und JS in die HTML geschrieben, siehe hier. Und trotzdem funktioniert es nicht. Wieso? Natürlich habe ich irgendwo einen dummen Fehler, weil ich Neuling bin. Aber wär mega cool, wenn ihr mir evtl. helfen könntet:
ich hab seitdem ich codepen.io für mich entdeckt hab immer wieder das "Problem", dass ich HTML, CSS und JS wie dort vorgegeben (meiner Meinung nach) richtig in meine HTML-Datei schreibe, der Effekt aber nicht erzeugt wird. Zur Verdeutlichung hier zwei Codepens, die ich wohl nicht richtig nutze:
- http://codepen.io/team/nclud/pen/MwaGGE
- http://codepen.io/noahblon/pen/wKvvxX
Bei dem ersten Code habe ich zum Test CSS und JS in die HTML geschrieben, siehe hier. Und trotzdem funktioniert es nicht. Wieso? Natürlich habe ich irgendwo einen dummen Fehler, weil ich Neuling bin. Aber wär mega cool, wenn ihr mir evtl. helfen könntet:
Code:
<!DOCTYPE html>
<head>
<style>
#page-structure{
height: 100vh;
}
.header-text {
h2, h1{
font-family: HelveticaNeue, Helvetica, Arial, "Lucida Grande", sans-serif !important;
font-weight: 900 !important;
}
}
</style>
<script type="text/javascript">
DER JS CODE VON CODEPEN. Wenn ich ihn hier einfüge sind es zu viele Zeichen!
</script>
</head>
<body>
<div id="initial-loader" class="padded"><span id="loader-text"></span></div>
<div id="main-body">
<section id="page-structure" class="ajax">
<header class="eliza height-95 black back-block-green-bottom-right">
<nav class="padded">
<a href="http://nclud.com" target="_blank"><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/141552/logo.svg" id="nclud-logo"></a>
</nav>
<div class="header-text grid_row padded-horizontal">
<h2 class="grid2">Revolutionary is our baseline. Different is our first step. And radical means we’re just getting started.</h2>
<h1 class="grid3">We are nclud.</h1>
</div>
<div id="canvas">
<img id="image" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/141552/header-home-fallback.jpg" data-fallback="https://s3-us-west-2.amazonaws.com/s.cdpn.io/141552/header-home-fallback.jpg">
</div>
</header>
</section>
</footer>
</body>
</html>
