Electric Boogaloo
Apr 27, 2016 18:01:40 GMT -6
Post by M on Apr 27, 2016 18:01:40 GMT -6
The Rules
- Do not remove the credit at the bottom.
- Do not repost without my permission.
- It would be lovely if you posted here with where you are using it.
style tags are required.
How to Use
This is a prototype so there may be bugs in it. The image is a 500x250 image split in half exactly. You'll need to upload the two halves and place them in the url spots.
This is a prototype so there may be bugs in it. The image is a 500x250 image split in half exactly. You'll need to upload the two halves and place them in the url spots.
[attr="class","ebhover"] [attr="class","ebtext"] Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras porttitor blandit commodo. Nullam euismod ex sit amet facilisis vulputate. Cras luctus, mauris et ullamcorper ornare, eros turpis vehicula erat, a fringilla ante dui eu ligula. Nunc odio leo, lacinia sed molestie et, imperdiet quis risus. Nullam congue erat mauris, a dapibus nisl blandit non. In quis facilisis turpis. Phasellus suscipit quis nunc vitae pharetra. Aenean sit amet tellus ex. Cras at tempor nunc, in condimentum orci. Quisque id est non massa consectetur pharetra eget nec justo. Suspendisse et venenatis nulla. Suspendisse pretium condimentum dictum. Pellentesque nec nulla ut dolor pharetra laoreet. In in maximus massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque tincidunt rutrum sapien ac viverra. Nam tellus nisi, porta id tortor ac, imperdiet venenatis lacus. Phasellus mattis cursus nisl et pellentesque. Mauris eu magna blandit, interdum tellus nec, commodo odio. Maecenas a lacus sed odio condimentum blandit ut at libero. Nam sit amet placerat sem, sed egestas eros. Sed eu enim sit amet arcu dictum convallis nec ut nulla. Sed nec odio a arcu suscipit dapibus sit amet quis diam. Etiam at rutrum tortor. Donec id turpis laoreet ipsum vulputate scelerisque nec sit amet erat. Etiam sit amet dui lobortis, mattis metus nec, iaculis ipsum. Proin consectetur, tellus nec fringilla tincidunt, metus nisl pellentesque nisl, ac dignissim sem lectus vitae odio. Aenean quis nunc quam. Curabitur bibendum sed nunc ut imperdiet. Nunc at metus in ante ultricies vehicula. Nullam magna risus, mollis quis volutpat nec, commodo eget mauris. Curabitur congue, dui a accumsan egestas, augue nisl consectetur ipsum, at suscipit neque lectus et felis. Fusce leo neque, tincidunt id elementum eget, iaculis sit amet enim. Vivamus quis dignissim nisl, at rhoncus leo. Nullam eu varius orci, id rhoncus magna. Pellentesque vel diam dapibus, eleifend ex quis, ultricies metus. Maecenas eget faucibus dolor, non ultricies diam. Nunc ac enim nec sapien condimentum dictum. |
[newclass=".eb1"]margin-top:-100px;background-image:url('http://i.imgur.com/T6FvAAJ.png');height:125px;width:500px;background-size:cover;transition:.8s;-webkit-transition:.8s;-o-transition:.8s;-moz-transition:.8s;transition-delay:.8s;-webkit-transition-delay:.8s;-o-transition-delay:.8s;-moz-transition-delay:.8s;[/newclass]
[newclass=".eb2"]background-image:url('http://i.imgur.com/bwZ2AC5.png');height:125px;width:500px; transition:.8s;-webkit-transition:.8s;-o-transition:.8s;-moz-transition:.8s;transition-delay:.8s;-webkit-transition-delay:.8s;-o-transition-delay:.8s;-moz-transition-delay:.8s;[/newclass]
[newclass=".ebtext"]height:350px;background-color:#001215;width:500px;opacity:0;margin-top:150px;transition:.8s;-webkit-transition:.8s;-o-transition:.8s;-moz-transition:.8s;[/newclass]
[newclass=".ebhover:hover .eb1"] transform:translateY(-150px);-ms-transform:translateY(-150px); -webkit-transform:translateY(-150px);transition:.8s;-webkit-transition:.8s;-o-transition:.8s;-moz-transition:.8s;[/newclass]
[newclass=".ebhover:hover .eb2"] transform:translateY(165px);-ms-transform:translateY(165px); -webkit-transform:translateY(165px);transition:.8s;-webkit-transition:.8s;-o-transition:.8s;-moz-transition:.8s;[/newclass]
[newclass=".ebhover:hover .ebtext"] opacity:1;transition:.8s;-webkit-transition:.8s;-o-transition:.8s;-moz-transition:.8s;transition-delay:.8s;-webkit-transition-delay:.8s;-o-transition-delay:.8s;-moz-transition-delay:.8s;[/newclass]
[div align="center"][table][tbody][tr][td][div][attr="class","ebhover"][div][attr="class","ebtext"][div align="center"][div style="height:50px;"][/div][div style="width:400px;background-color:#000b0d;border:#00DFFB dashed 2px;color:#ffffff;padding:10px;"][div align="justify" style="height:250px;overflow:auto;padding-right:5px;"]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras porttitor blandit commodo. Nullam euismod ex sit amet facilisis vulputate. Cras luctus, mauris et ullamcorper ornare, eros turpis vehicula erat, a fringilla ante dui eu ligula. Nunc odio leo, lacinia sed molestie et, imperdiet quis risus. Nullam congue erat mauris, a dapibus nisl blandit non. In quis facilisis turpis. Phasellus suscipit quis nunc vitae pharetra. Aenean sit amet tellus ex. Cras at tempor nunc, in condimentum orci. Quisque id est non massa consectetur pharetra eget nec justo. Suspendisse et venenatis nulla. Suspendisse pretium condimentum dictum. Pellentesque nec nulla ut dolor pharetra laoreet. In in maximus massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Quisque tincidunt rutrum sapien ac viverra. Nam tellus nisi, porta id tortor ac, imperdiet venenatis lacus. Phasellus mattis cursus nisl et pellentesque. Mauris eu magna blandit, interdum tellus nec, commodo odio. Maecenas a lacus sed odio condimentum blandit ut at libero. Nam sit amet placerat sem, sed egestas eros. Sed eu enim sit amet arcu dictum convallis nec ut nulla. Sed nec odio a arcu suscipit dapibus sit amet quis diam. Etiam at rutrum tortor. Donec id turpis laoreet ipsum vulputate scelerisque nec sit amet erat.
Etiam sit amet dui lobortis, mattis metus nec, iaculis ipsum. Proin consectetur, tellus nec fringilla tincidunt, metus nisl pellentesque nisl, ac dignissim sem lectus vitae odio. Aenean quis nunc quam. Curabitur bibendum sed nunc ut imperdiet. Nunc at metus in ante ultricies vehicula. Nullam magna risus, mollis quis volutpat nec, commodo eget mauris. Curabitur congue, dui a accumsan egestas, augue nisl consectetur ipsum, at suscipit neque lectus et felis. Fusce leo neque, tincidunt id elementum eget, iaculis sit amet enim. Vivamus quis dignissim nisl, at rhoncus leo. Nullam eu varius orci, id rhoncus magna. Pellentesque vel diam dapibus, eleifend ex quis, ultricies metus. Maecenas eget faucibus dolor, non ultricies diam. Nunc ac enim nec sapien condimentum dictum.
[/div][/div][/div][/div][div style="margin-top:-300px;"][div][attr="class","eb1"][/div][div][attr="class","eb2"][div style="padding-top:125px;"][font size="1"]created by [a href="http://poweringrp.proboards.com/user/2"]M[/a] of [a href="http://poweringrp.proboards.com/"]PR[/a][/font][/div][/div][/div][/div][/td][/tr][/tbody][/table][/div]
[newclass=".eb1"]margin-top:-100px;background-image:url('http://i.imgur.com/T6FvAAJ.png');height:125px;width:500px;background-size:cover;transition:.8s;-webkit-transition:.8s;-o-transition:.8s;-moz-transition:.8s;transition-delay:.8s;-webkit-transition-delay:.8s;-o-transition-delay:.8s;-moz-transition-delay:.8s;[/newclass]
[newclass=".eb2"]background-image:url('http://i.imgur.com/bwZ2AC5.png');height:125px;width:500px; transition:.8s;-webkit-transition:.8s;-o-transition:.8s;-moz-transition:.8s;transition-delay:.8s;-webkit-transition-delay:.8s;-o-transition-delay:.8s;-moz-transition-delay:.8s;[/newclass]
[newclass=".ebtext"]height:350px;background-color:#001215;width:500px;opacity:0;margin-top:150px;transition:.8s;-webkit-transition:.8s;-o-transition:.8s;-moz-transition:.8s;[/newclass]
[newclass=".ebhover:hover .eb1"] transform:translateY(-150px);-ms-transform:translateY(-150px); -webkit-transform:translateY(-150px);transition:.8s;-webkit-transition:.8s;-o-transition:.8s;-moz-transition:.8s;[/newclass]
[newclass=".ebhover:hover .eb2"] transform:translateY(165px);-ms-transform:translateY(165px); -webkit-transform:translateY(165px);transition:.8s;-webkit-transition:.8s;-o-transition:.8s;-moz-transition:.8s;[/newclass]
[newclass=".ebhover:hover .ebtext"] opacity:1;transition:.8s;-webkit-transition:.8s;-o-transition:.8s;-moz-transition:.8s;transition-delay:.8s;-webkit-transition-delay:.8s;-o-transition-delay:.8s;-moz-transition-delay:.8s;[/newclass]