{"id":1842,"date":"2017-02-02T19:22:33","date_gmt":"2017-02-02T23:22:33","guid":{"rendered":"http:\/\/ashleychiasson.com\/blog\/?p=1842"},"modified":"2017-02-09T09:11:15","modified_gmt":"2017-02-09T13:11:15","slug":"click-and-reveal-converting-layers-to-states","status":"publish","type":"post","link":"https:\/\/ashleychiasson.com\/blog\/click-and-reveal-converting-layers-to-states\/","title":{"rendered":"Click and Reveal: Converting Layers to States"},"content":{"rendered":"<p>Some people like to program their click and reveal interactions using layers, and some people like to program their click and reveal interactions using states. In this demonstration, I show you a project I had previously created, which uses layers for a click and reveal interaction. I then show you how you can create a similar effect using the Selected state.<\/p>\n<p>The main benefit (to me) of using states for these click and reveal interactions is that it cuts down on the congestion of your slide layers, which can be beneficial for organizational purposes.<\/p>\n<p style=\"text-align: center;\">Check out the demo below!<\/p>\n<p><center><iframe loading=\"lazy\" src=\"https:\/\/player.vimeo.com\/video\/202295865\" width=\"640\" height=\"400\" frameborder=\"0\" webkitallowfullscreen mozallowfullscreen allowfullscreen><\/iframe><\/center><\/p>\n<p><!-- Begin MailChimp Signup Form --><\/center><\/p>\n<div id=\"mc_embed_signup\">\n<form id=\"mc-embedded-subscribe-form\" class=\"validate\" action=\"\/\/ashleychiasson.us3.list-manage.com\/subscribe\/post?u=590453f5b6494f21bc89fa764&amp;id=00e1c8c434\" method=\"post\" name=\"mc-embedded-subscribe-form\" novalidate=\"\" target=\"_blank\">\n<div id=\"mc_embed_signup_scroll\"><label for=\"mce-EMAIL\">Subscribe for information on Sprout E-Learning&#8217;s launch date!<\/label><br \/>\n<input id=\"mce-EMAIL\" class=\"email\" name=\"EMAIL\" required=\"\" type=\"email\" value=\"\" placeholder=\"email address\" \/><br \/>\n<!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups--><\/p>\n<div style=\"position: absolute; left: -5000px;\"><input tabindex=\"-1\" name=\"b_590453f5b6494f21bc89fa764_00e1c8c434\" type=\"text\" value=\"\" \/><\/div>\n<div class=\"clear\"><input id=\"mc-embedded-subscribe\" class=\"button\" name=\"subscribe\" type=\"submit\" value=\"Subscribe\" \/><\/div>\n<\/div>\n<\/form>\n<\/div>\n<p><!--End mc_embed_signup--><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Some people like to program their click and reveal interactions using layers, and some people like to program their click and reveal interactions using states. In this demonstration, I show you a project I had previously created, which uses layers for a click and reveal interaction. I then show you how you can create a [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":"","jetpack_post_was_ever_published":false,"jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":[]},"categories":[24],"tags":[23],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p4s3cq-tI","_links":{"self":[{"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/posts\/1842"}],"collection":[{"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/comments?post=1842"}],"version-history":[{"count":2,"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/posts\/1842\/revisions"}],"predecessor-version":[{"id":1875,"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/posts\/1842\/revisions\/1875"}],"wp:attachment":[{"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/media?parent=1842"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/categories?post=1842"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ashleychiasson.com\/blog\/wp-json\/wp\/v2\/tags?post=1842"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}