Last active
December 15, 2015 09:58
-
-
Save z3cka/5241805 to your computer and use it in GitHub Desktop.
image link overlay hack. this will place an image over another image that is within an anchor tag.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* video button/link styles */ | |
| div.field-name-field-video-link a, | |
| a.video-button-new { display: inline-block; position: relative; } | |
| div.field-name-field-video-link a div.video-button-overlay, | |
| a.video-button-new div.video-button-overlay { | |
| background-image: url('../images/play.png'); | |
| width: 93px; | |
| height: 91px; | |
| background-repeat: no-repeat; | |
| position: absolute; | |
| top: 0; right: 0; bottom: 0; left: 0; | |
| margin: auto; | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| (function($) { | |
| $(document).ready(function() { | |
| // adding video link overlay | |
| $('div.field-name-field-video-link a img, a.video-button-new img').before('<div class="video-button-overlay"></div>'); | |
| }); | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
obviously this does not include everything you need... like the actual HTML :-P