cssAudio - ActiveCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - Activehtmloctocatspinnerstartv headernumbered-list123split-screen
user profile image

I'm trying to come up with ideas for my new site's homepage and "mem". Just testing out another hover technique.


  1. Good Job, It's simply and flat design ;-) But it's possible for multi-galery? ThX

  2. @cedric, you can totally use it in a multi-gallery. It's really easy. I made everything in classes so it really easy to make it work together.

  3. Hi, Yes it's possible, but i have to duplicate all CSS for one image or do you have a other solution? Because, it's a galery with 60 images (background different) and the code (Css) is so long if i duplicate for all. What do you think?

  4. @cedric Well, there are a few options that would make that happen. The one with the least amount of code and that is dynamic would have to use javascript. You would then set a data attribute on the .content-item. Here is an example: http://codepen.io/davidleininger/pen/tqmyn

  5. Hi, it's OK! This code is very good for multi-galery. And the code is light. I didn't see this version. Nice Job ;-) ThX.

  6. @cedric, that's because I made it after you asked for it, haha! I'm glad it works.

  7. Ha ok, ;-) It's good. I'll try to add the option page for only 4 or 6 boxes per page. For don't have a page with a height so strong. If you want, i send you this modification if i found that ;-)

  8. Hi David - I love your Text Revel on Hover: Corner Trianlge Slide Overlay! I am also interested in doing a multi display (just 3 across). I have added the html, css & js to my page but the animation is not working. Sorry I'm new to CodePen and am probably doing something silly. If you have a minute please take a look at: http://www.kaufmanwebconsulting.com/womens-new/about-us-new-multi.html. You will notice that I have not changed the images/content yet. Thanks very much! Linda

  9. @lindak816 - You probably copied the SCSS code. Click the complied view. That should work.


  10. Thanks David for your reply! I actually got it working but it's not perfect yet. My problem is that it looks great on a large monitor or MacBook but on an iPad the 3 overlay images I created (from your code) are set to 100% width apparently and I can't get it to stay within the constraints of the division above it. If you have a moment if you could take a look at my test page at: http://www.kaufmanwebconsulting.com/womens-new/about-us.html - and let me know what you think I am doing wrong. Your help is very much appreciated! Linda

  11. Hello can someone tell what to do my @import "compass/css3" is not working.

Leave a Comment Markdown supported. Click @usernames to add to comment.

You must be logged in to comment.