{"id":3369,"date":"2016-04-23T00:17:59","date_gmt":"2016-04-23T00:17:59","guid":{"rendered":"http:\/\/b.parsons.edu\/~dejongo\/?p=3369"},"modified":"2016-04-23T00:45:08","modified_gmt":"2016-04-23T00:45:08","slug":"10-putting-it-all-together","status":"publish","type":"post","link":"https:\/\/b.parsons.edu\/~dejongo\/10-putting-it-all-together\/","title":{"rendered":"10 Putting it All Together"},"content":{"rendered":"<p><a href=\"http:\/\/codepen.io\">CodePen <\/a>has amazing examples that are an inspiration for how to use CSS3 in ways that will inspire you. The code at times needs to be compiled (so it looks like the HTML or CSS you are familiar with) Here are some examples. Poke around, and send me any additional examples you find compelling.<\/p>\n<h2>Pure CSS Parallax<\/h2>\n<p data-height=\"400\" data-theme-id=\"dark\" data-slug-hash=\"JycFw\" data-default-tab=\"css,result\" data-user=\"keithclark\" data-embed-version=\"2\" class=\"codepen\">See the Pen <a href=\"http:\/\/codepen.io\/keithclark\/pen\/JycFw\/\">Pure CSS Parallax Scrolling<\/a> by Keith Clark (<a href=\"http:\/\/codepen.io\/keithclark\">@keithclark<\/a>) on <a href=\"http:\/\/codepen.io\">CodePen<\/a>.<\/p>\n<p><script async src=\"\/\/assets.codepen.io\/assets\/embed\/ei.js\"><\/script><\/p>\n<h2>Animated Interfearence Patterns<\/h2>\n<p data-height=\"400\" data-theme-id=\"dark\" data-slug-hash=\"ujcIy\" data-default-tab=\"css,result\" data-user=\"keithclark\" data-embed-version=\"2\" class=\"codepen\">See the Pen <a href=\"http:\/\/codepen.io\/keithclark\/pen\/ujcIy\/\">Single element Atari ST demo effect<\/a> by Keith Clark (<a href=\"http:\/\/codepen.io\/keithclark\">@keithclark<\/a>) on <a href=\"http:\/\/codepen.io\">CodePen<\/a>.<\/p>\n<p><script async src=\"\/\/assets.codepen.io\/assets\/embed\/ei.js\"><\/script><\/p>\n<h2>CSS Shapes<\/h2>\n<p data-height=\"400\" data-theme-id=\"dark\" data-slug-hash=\"vGRBeQ\" data-default-tab=\"html,result\" data-user=\"brob\" data-embed-version=\"2\" class=\"codepen\">See the Pen <a href=\"http:\/\/codepen.io\/brob\/pen\/vGRBeQ\/\">CSS Shapes<\/a> by Bryan Robinson (<a href=\"http:\/\/codepen.io\/brob\">@brob<\/a>) on <a href=\"http:\/\/codepen.io\">CodePen<\/a>.<\/p>\n<p><script async src=\"\/\/assets.codepen.io\/assets\/embed\/ei.js\"><\/script><\/p>\n<h2>Playing with CSS Filters<\/h2>\n<p data-height=\"400\" data-theme-id=\"dark\" data-slug-hash=\"rpIKz\" data-default-tab=\"css,result\" data-user=\"samthejarvis\" data-embed-version=\"2\" class=\"codepen\">See the Pen <a href=\"http:\/\/codepen.io\/samthejarvis\/pen\/rpIKz\/\">Playing with CSS Filters.<\/a> by Sam Jarvis (<a href=\"http:\/\/codepen.io\/samthejarvis\">@samthejarvis<\/a>) on <a href=\"http:\/\/codepen.io\">CodePen<\/a>.<\/p>\n<p><script async src=\"\/\/assets.codepen.io\/assets\/embed\/ei.js\"><\/script><\/p>\n","protected":false},"excerpt":{"rendered":"<p>CodePen has amazing examples that are an inspiration for how to use CSS3 in ways that will inspire you. The code at times needs to be compiled (so it looks like the HTML or CSS you are familiar with) Here &hellip; <a href=\"https:\/\/b.parsons.edu\/~dejongo\/10-putting-it-all-together\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[15],"tags":[],"_links":{"self":[{"href":"https:\/\/b.parsons.edu\/~dejongo\/wp-json\/wp\/v2\/posts\/3369"}],"collection":[{"href":"https:\/\/b.parsons.edu\/~dejongo\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/b.parsons.edu\/~dejongo\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/b.parsons.edu\/~dejongo\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/b.parsons.edu\/~dejongo\/wp-json\/wp\/v2\/comments?post=3369"}],"version-history":[{"count":3,"href":"https:\/\/b.parsons.edu\/~dejongo\/wp-json\/wp\/v2\/posts\/3369\/revisions"}],"predecessor-version":[{"id":3372,"href":"https:\/\/b.parsons.edu\/~dejongo\/wp-json\/wp\/v2\/posts\/3369\/revisions\/3372"}],"wp:attachment":[{"href":"https:\/\/b.parsons.edu\/~dejongo\/wp-json\/wp\/v2\/media?parent=3369"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/b.parsons.edu\/~dejongo\/wp-json\/wp\/v2\/categories?post=3369"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/b.parsons.edu\/~dejongo\/wp-json\/wp\/v2\/tags?post=3369"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}