miketricking / bootstrap-image-hover Goto Github PK
View Code? Open in Web Editor NEWImage hover effects that work with or without bootstrap
Home Page: https://miketricking.github.io/bootstrap-image-hover
License: MIT License
Image hover effects that work with or without bootstrap
Home Page: https://miketricking.github.io/bootstrap-image-hover
License: MIT License
Hi Mike,
I am trying to use both effect 6 and 12 on a page but the supplied CSS is clashing. I've tried to look at your CSS on the main demo page and notice you are renaming things to ehover but could you help me combine the CSS for just those 2? Or any tips you could give would be great - I'm not very technical.
Thanks in advance,
Hannah
Great effect. But what if I want to add more elements such as p , span, img to overlay, what should I do? Thanks
You should make it available with bower.
Hi,
I love your work and use it regularly.
Latetly I noticed that the effects 3, 6 and 13 do not work on IE as IE does not know how to interpret "filter:".
Do you have an idea for a workaround?
Thanks
Effect 13's code shows
.hovereffect a, hovereffect p {
I believe it should be
.hovereffect a, .hovereffect p {
I can submit a pull request if preferred, but I figured this was easier for something small.
Hi,
Can you add css to h2 transform from bottom to top?
Thank so much!
Hi Mike,
First of all, I love your code. This is the most elegant and beautiful solution I could find.
However I ran into something strange. I'm using a navigation bar with the "affix" class in BootStrap. So my navbar is just a simple default navbar, except when you scroll it sticks to the top.
I want to use effect 12. So here is the situation.
When the navbar is static, so not in "sticky"-mode, I see no problem. When I scroll and the navbar goes into "sticky"-mode (no longer static) there appears a 1px border along the bottom of image (same color I use for .hovereffect).
Also when I scroll back to the top (navbar becomes static again) the border goed away.
Could you look into this please?
Need more documentation for this great job. So a newbie can framework using bootstrap or without bootstrap.
Hi Mike,
I've got the blocks working really nicely on my site. Only thing is, when it's on an ipad/mobile device, it's not working. When you view your examples on the ipad and you click on one of the blocks, the whole panel with the code pops up but on my test pages, nothing happens (as in, no hover effect and then
displayed to allow for clicking) . Have you included a bit of jquery or some additional code to get these to work on mobile devices or any idea how I can make the box itself the trigger/link as when I've played around and tried to do this so far, it knocks everything out.
Any ideas or suggestions greatly received, thank you!
When am hovering the image the anchor tag is not working because of the #css3, in yours you missed the -moz browser compatibility coding. If you fix it users will get fulfill from yours hover things.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.