Streaming live at 10am (PST)

Show/Hide feature is flickering on click trigger - help?


#1

https://preview.webflow.com/preview/blurred-6c2a09?preview=f506d84d61127f1237c0bb04855e2102

I've attempted to add the show/hide (my block also has an overlay hover) but it's not looking too good. Could anyone please advise?

Thank you!


#2

HI @Allix_Hannah

Which block are you talking about ? :slight_smile:


#3

Sorry! It's in the speaker section :slight_smile: (The section with the social icon hover)


#4

This one right ?


#5

Yes! :slight_smile: That's exactly what I am referring too.


#6

Ok :smiley:

So first i think this effect looks cool, maybe just a bit too slow.

You could add an overlay color between your image and your text to make it more readable like so


#7

Then i'm not sure what this is supposed to do ? :smiley:

(The black text and pink line)


#8

That's absolutely a possibility! So, I'm trying to also add a longer biography to the image in addition to that hover. (I've added the extra "text-bio" section within my dynamic list) I've added a "click" trigger to the overlay in addition, but when you try clicking the image, the longer biography flashes and then disappears!

I'm trying to have a click trigger similar to the image I've attached so that the longer text will pop out on an on-click.

With the webflow template I have purchased, there is an overlay, and a few other layers inside the dynamic list.

I'm trying to figure out which layer to choose, in order to add the on click!

Thank you! :slight_smile:


#9

Ok,

Is this page in your template ? (the screenshot) or do you need to rebuild everything ?
Is it your first project on Webflow ? I mean do i have to explain the entire process ? :smiley:


#10

Absolutely not!

Disregard the entire style/colors. (MINUS the fact that the text is styled UNDER the speakers, and right now my dynamic element is placed as a z-index on top of my speaker box)

Mainly this is about functionality - I've added a hide/show click to my speaker section but the long bio flickers when I try and click the speakers. (I've added a hide/show click, and something is not working correctly.) You are able to see the biography for a second, but it quickly goes away.

Ideally, I'm trying to style the biographies to look like this - but I'm not sure if that is possible, since it is inside my dynamic list elements.

If I am unable to style it as so, all I am looking to do is have the biography working when you click the speakers on the dynamic list. rather than what it is doing now.


#11

Ok great !!

So i guess i have an idea :slight_smile:

Put an overflow scroll on dynamic list wraper, and change the height to let's say 50vh

Set it to relative and remove relative on Dynamic team item (set to auto)

Put a new div in speaker wraper absolute top, Zindex 5000 and give it a height.

Add a rich text inside connected to long form bio.

And then set your animations, it should work :slight_smile:


#13

I'm wondering, why does your entire template layout look different than mine? It should only be 8 speakers, and my speaker width is the width of the entire page. Do you need me to send over a new read only link?


#14

zbrah, this is what's happening when I'm trying to do this....:disappointed_relieved:


#15

Hum strange,

Yes maybe send me another link.
I'll have a look tomorrow


#16

https://preview.webflow.com/preview/blurred-6c2a09?preview=f506d84d61127f1237c0bb04855e2102

There you are!


#17

Ok :slight_smile: Feel free to @zbrah me tomorrow if i forget


#18

:slight_smile: Of course. I will check back tomorrow!!! Thanks again for your help


#19

ok my bad i wrote too fast, let relative on speaker block


#20

So, I've set the div block to a z-5000 index and set it to absolute top, which put it to the top of the speakers, but not above them - in addition, when I set my dynamic list item to auto, it stripped the speaker names away and threw them into the left corner above the speakers. I've followed the steps but no luck.

I've additionally created a div that isn't nested into the dynamic list, and attempted the hide/show through https://interactions.webflow.com/click-to-show-content-video which worked...

I would just need to know how to have an outside div linked to my dynamic list without bringing it inside the layers, so that the text for each additional speaker shows.

Thanks again.... :slight_smile:


#21

Hum i've tried to redo everything but i'm stuck :frowning:
To answer to your question you can't link an outside div to your dynamic collection.