Image bounce effect...?

@yellow

If I understand, I think what you mean is when using the “Image Bounce Effect” bex file, it has no interaction menu when clicking the image. Is this correct? What interaction are you wanting exactly?

@johnandrew

Yes the Image Bounce Effect bex file has no interaction. I like to have navigate to URL interaction.

Download the bloc/bric that ive said to find (a few times) and on the right hand side set the image to go to a URL.

I did this the other week for a clients profile where they wanted his image to zoom on hover and click to go to his profile page.

@ [AdieJAM]
If the Bounce Effect bric has no Interaction you can no set it… so there should be this/such a bric with interaction.

Hi @yellow - can you send me the link to the brief and possible a video to the effect you are looking for?

Did you find the bric in the searches myself & Pete mentioned?

I’m sure what you are looking for very easy

I’m looking for this effect posted here:

unfortunately the bric has no interaction…

Seems to be very difficult if nobody can provide a solution for such an effect with interactivity in blocs

It’s not difficult at all. It takes a few minutes to make, once you learn how.

The bric works as it was intended. Just not want you want. Custom brics don’t work with the inbuilt interactions they have to be coded into the bric as options. The bric is also a basic sample bric from the bric builder but with some CSS added, the same CSS given in the thread the bric was offered on. You can look at the bric HTML to see how it works.

Everything is there for you try. I think people are waiting for you to show some effort on your part. It’s all about learning.

1 Like

Hey, do you looking for an interaction like in these template Home | Auto Service Template ?

You can do this with 3 div-container. This is the structure:

3 Likes

Nice work as usual Ralf (@RME )

1 Like

I tried it with a dromeas project - no success…

the first div needs a custom class:

the second div is for the image and has this custom class:


Important are these options:

and the third div is for the buttom and the h3-text:

for the animation you need a css:

.overlay {
opacity: 0;
transition: 0.7s ease-in-out;
}
.overlay h3 {
margin-top: 30px;
transition: 0.8s ease-in-out;
}
.img {
transition: 1s ease-in-out;
}
.wrapper:hover .overlay {
opacity: 1;
transition: 0.7s ease-in-out;
}
.wrapper:hover .img {
background-size: 104% auto;
transition: 1s ease-in-out;
}
.wrapper:hover .overlay h3{
margin-top: -10px;
transition: 0.8s ease-in-out;
}

Maybe it helps you.

1 Like

I have tried this now but with dromeas no success…

I would avoid generic selector names and img by itself, ideally use a unique selector beforehand. For example, you’re adding that transition to every image on the page.

Why isn’t it possible to that someone can provide a bric like the Image Bounce Effect.bex with interactivity…?

Hi @yellow

What you mean by that ? You also use dromeas and you tried different solutions and it doesent work? Did you try it on a new project ?

You could try asking someone to make a bespoke one for you and pay them?
Just saying……

When you dont need a caption - only a Image and a zoom effect try this …

  1. Use the div bric
  2. Inside the div insert a image
  3. Set a class “wrapper” Open the Class and set a width you like and use overflow = hidden
  4. click the image and set a link you like
  5. insert the little css snippet

#tom2 tried your suggestion but no success with Dormeas

Hi @yellow

could you implement one solution - rme or mine - and send a link ?
I can’t check it because I dont use dromeas …
tom