KnowledgeHub
Questions
Tags
Users
Search
Alex Rivera
|
Logout
Edit Question
Title
Body
I created a box that fades into another div when hovered over. This was all done using CSS3. However, one problem I realized was that the hovers don't work in mobile browsers. Is there a way to somehow make this work for mobile or do I have to resort to using some sort of JS? EDIT: To clarify, I just want to be able to tap the box and have the description show. I've seen it on other websites. How is this usually done? :) JS Fiddle: http://jsfiddle.net/ygShH/4/ HTML <article class="project"> <div class="project-mask"> <div class="thumbnail"> <img src="http://dummyimage.com/292x292/000/fff" alt="desc" height="260" width="260"> <div class="description"> <hgroup> <h2>Title</h2> <h3>Web</h3> </hgroup> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p> <span> <a href="http://site.com" target="_blank">Visit website</a> <a href="/view-project">View project</a> </span> </div> </div> </div> </article> CSS body { background:#f4f3f1; color:#666; font:62.5%/1.6 Helvetica, Arial, Sans-serif; } p { font-size:1.1em; margin:0 0 1em; } h1,h2,h3 { color:#222; font-weight:400; } h2 { font-size:1.5em; margin-top:0; } h3 { font-size:1.1em; } article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,input,textare
Tags (comma-separated)
Save Edits
Cancel