hover effect with input instead img

  1. MDB Home Page
  2. Support Main Page
  3. General Bootstrap questions
Topic: hover effect with input instead img

adi asked 6 years ago

i got all the hover-effects running from https://mdbootstrap.com/docs/jquery/css/hover-effects/

but if i want to use an image as button with the same effect (zoom for example) i'd go:

<div class="view overlay zoom">
    <input type="image" name="submit" src="https://mdbootstrap.com/img/Photos/Horizontal/Nature/6-col/img%20(131).jpg" class="img-fluid">
    <div class="mask flex-center">
        <p class="white-text">Zoom effect</p>
    </div>
</div>

but then the zoom is not working, only the Text effect is showing. Any suggestions?

Marta Szymanska staff pro premium answered 6 years ago

Hi,

please, put your code to the snippet here: https://mdbootstrap.com/snippets/ to let me see a live example. Also, you can provide a more detailed description of the problem. I'll try to help you with that.

Best, Marta

Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: macbook
  • Browser: brave
  • OS: osx
  • Provided sample code: No
  • Provided link: Yes
Tags
input-image-hover-effect
About author
adi
5Support score
1Questions 0Answers
0Snippets likes 0Snippets