To toggle and to hide visibility of some blocs


#1

Hello,

Can anyone please help me? I need to toggle visibility of one bloc and at the same time to hide other blocs.

How can I implement this?

Thnaks,
Dan


#2

Hello you have to:

  1. Create one bloc and in ID put the ID you want, lets say “show” and in the VISIBILITY let active the eye.
  2. Create another bloc and in ID put the ID you want, lets say “hide” and in the VISIBILITY unselect the eye (you will see the bloc greyed)
  3. Create a button or a link and in the INTERATIONS TYPE choose Toggle Visibility and in the target ID’s type: show,hide

Hope I help you…


#3

Thanks for helping.

Let’s say, I have 4 hyperlinks. Each of them once clicked should show a given paragraph and at the same time hide the other 3.

  • link1 should show paragraph1 and hide paragraph2-3-4
  • link2 should show paragraph2 and hide paragraph1-3-4
  • link3 should show paragraph3 and hide paragraph1-2-4
  • link4 should show paragraph4 and hide paragraph1-2-3

Unless I miss something, your suggestion works with just one link but not with mor than 1.

Any idea?

Thnaks,
Dan


#4

There is no automatic way of hiding the blocks when another is made visible (like an accordion) The simple way to deal with the problem is provide a close button in each paragraph bloc. You could then use a custom class to adjust the position of the block so it obscures the trigger links. This way, the user will have to click the close button before being able to click on another link. It’s not ideal, but it does work. The other alternative is to use a third-party accordion and add it to your Blocs project via an HTML widget.


#5

I think what you are looking for is similar to what I have done on this page https://mrroofingandleadwork.uk/slate-tile-roofing/ if you click on the roof tile type links, but this was done in Rapidweaver, using a stack called peek-a-boo and we don’t have anything like that in Blocs at present. It may well be that the underlying functionality could be found through some other source.


#6

Good evening @MDS, @Eldar, @Jakerlund, community!

I personally need your help. I follow full time with my wife’s project and I thought to open a new related topic, but in the end I thought it was better to go to you in line with the subject that I know that disturbs many of us.

In my case I am making a personalized menu, within its complexity, it is quite simple, but there is something that worries me and that I need to solve to optimize the user experience of my future patients.

I needed to find even a javascript, that would allow me to control the visibility of the blocks, that is …

a “menu” block, which gives rise to other blocks of content, but between several options (A, B, C), the remaining options disappear and remain hidden. That is, that only the selected option is displayed. :smiley:

Right now, if the customer presses one by one, I have a nice giant and uncontrolled menu. :cry:

I value your time and your help very much, but as always, I know that without you, I would not be able to reach heaven.

Thanks in advance. I am impatient to give solution to such a big headache.

I pray to achieve it. :pray:

Jesús. - Dreamsur -

Note: By the way @jakerlund, how do you take the recovery of the operation? I hope that little by little you reestablish normalcy. My best wishes from Madrid, Spain.


#7

#8

Visibility vs Display

I know it’s a little weird to answer myself, but it was such a need or maybe I wanted to solve it, that my brain started looking for a solution.

Tomorrow morning I am convinced that I will give a little joy to the community when publishing, my little creation!

The solution has been to include the property in the button:

onclick = "myFunction ()"

and then insert a javascript code, which you will have to create to the consumer’s taste:

<script>
function myFunction () {
  document.getElementById ("bloque01"). style.display = "default";
  document.getElementById ("bloque02"). style.display = "none";
}
function myFunction2 () {
  document.getElementById ("bloque01"). style.display = "none";
  document.getElementById ("bloque02"). style.display = "default";
}
</ script>

The truth is that I do not know if it could be done in a cleaner way, as regards the code, but right now I have that rewarding feeling that programmers feel, when you are able to give life to your ideas, through your creations.

Here the staging:

Magic Menu.bloc (727.0 KB)

How do you see it? Any recommendations for improvement?

A big hug for everyone. We keep growing! :muscle:


#9

Hi @Dreamsur

I’ve never used hide/show blocs elements but you seem to have it solved :+1:
It would be great if it could have a timer so if a menu opens up and your mouse isn’t on it, it would close after 5-10 seconds.
Maybe someone who is skilled with scripts could add it.

Thanks for asking, the shoulder and arm is healing but it takes time.
It will be about 3 months until i can use it fully again.
Maybe i’ll have problem going through the airport metal detector though.
It’s some metal plates, 18 screws and they used 18 metal staples instead of stiches :weary:

Cheers

shoulder


#10

No arm wrestling for you Johny. Heal fast, my friend. :grinning:


#11

Hi @Jakerlund

Wow! wishing you a speedy recovery.

MDS


#12

oh wow! what happened?

Wishing you a fast recovery :pray:


#13

Good morning guys!

First of all, tell our colleague @Jakerlund, that I sincerely hope you have a quick improvement, because the truth is that from my own experience, I know it will be slow, but believe me if you are patient and do everything doctors tell you, finally you will get to recover. Much encouragement!

On the other hand, I must thank you for your contribution, although I feel a little sad. Because although I have tried hard to understand the code a bit and investigate, about the timer … I do not get to the key of the correct script, since at the moment I include more content in that structure … it does not work.

I attach an example:

Magic Menu2.bloc (731.2 KB)

For the time being I know that it has to be something from setTimeout, or setInterval, but I get lost.

Could you help me solve this riddle? I need you please. :pray:

Thank you all in advance, to help me make it happen.

Dreamsur :surfing_man:


#14

UPGRADE - THE BEST MENÚ

I have achieved it, now yes yes, available to all of you!

I have included the advice of @Jakerlund and I have put a timer that closes automatically with a slideup effect, so it is sublime.

There I leave it, I hope to see the implementations you make!

Thank you all for helping me to improve myself. :heart:

The best menu.bloc (732.9 KB)

For you Blocs Rockers!! :surfing_man:


Accordian Bric
#15

@Jakerlund that’s looks really painful…hope you’re getting some good drugs to help. Are they going to remove some after you heal? Also is this your dominant hand?

casey


#16

Great job @Dreamsur :+1:
It would be nice if the menu would stay out as long as the mouse is on it and the timer starts as soon as you leave it. We could then use that as a nice Megamenu thingy.

Thanks guys :woozy_face:
This is by far the friendliest and most supportive forum.
It’s cool to see how willing people are to step in and help. :heart_eyes:

@Norm i had a really bad fall where i first dislocated my left shoulder and then landed on it resulting in the shoulder joint got crushed and the arm got broken.
The joint was in such a mess that they didn’t think they would be able to put it all together without replacing parts. But after the 2:nd surgery they were very pleased and said that they now had everything in place.
Thankfully the mouse arm works :+1:

@casey1823 thanks, yes i’m on some serious pain meds for the first weeks which works pretty good. :+1:

Cheers / Johny


#17

wowza! that sounds painful. Im glad it’s on the mend now!


#18

@Jakerlund sadly and to my own amazement, I have 0 knowledge about javascript, come on I feel like god having achieved what I have achieved. :sweat_smile:

But I greatly appreciate your recommendations, because you can see that in your words, there is an appreciated experience in the field.

Although I think it is a good basis for someone who has more extensive knowledge on the subject. At the moment I think I will have helped to expand our battery of resources to work with Blocs!

The truth is that you are right, it is a pride to be part of this great family.

I wish you a quick improvement. A hug. :wink: