I asked about this in the above thread but it wasn’t getting the attention it deserved so I decided to post a new thread here.
My question is simple: I want to click on an HTML item to make it vanish, but how do I do that?
With Graphic items, it’s easy. I just apply the Hide Slaves (alternate) action and the “Target Show/Hide Layer” action to the same Graphic item. Then by setting the Target/Slave “Group” to be the same on both actions, I just need to click on the Graphic item in the browser to make it hide. But sadly, this doesn’t work on HTML items.
The ultimate aim here is a clickable map. My web page viewers will pull up a page that has a map of Japan. The map is divided into clickable sections, each of those sections having a rollover applied.
Clicking on one of those rollover sections brings a particular HTML item into view – an HTML item that has the “Target Show/Hide Layer” action applied to it. Setting the HTML item to “Toggle” in the “Target Show/Hide Layer” settings allows me to hide that HTML item with a second click on the rollover. But I also want to empower my users to be able to hide that same HTML item with a click on the HTML item itself. It’s such a simple thing, it’s surprising I cannot find a way to do this.
I look forward to your suggestions on how I can accomplish this.
Well, you can make something vanish quite easily on a click. The
question is, do you want to be able to make it appear again later?
Add the following in the Extended dialog:
Name: onclick
Value: this.style.display = 'none';
One click, and it’s gone. Anything that wants to get it back again
will have to target it by name or ID and then issue the opposite:
this.style.display = ‘block’;
I asked about this in the above thread but it wasn’t getting the
attention it deserved so I decided to post a new thread here.
My question is simple: I want to click on an HTML item to make it
vanish, but how do I do that?
With Graphic items, it’s easy. I just apply the Hide Slaves
(alternate) action and the “Target Show/Hide Layer” action to the
same Graphic item. Then by setting the Target/Slave “Group” to be
the same on both actions, I just need to click on the Graphic item
in the browser to make it hide. But sadly, this doesn’t work on
HTML items.
The ultimate aim here is a clickable map. My web page viewers will
pull up a page that has a map of Japan. The map is divided into
clickable sections, each of those sections having a rollover applied.
Clicking on one of those rollover sections brings a particular HTML
item into view – an HTML item that has the “Target Show/Hide Layer”
action applied to it. Setting the HTML item to “Toggle” in the
“Target Show/Hide Layer” settings allows me to hide that HTML item
with a second click on the rollover. But I also want to empower my
users to be able to hide that same HTML item with a click on the
HTML item itself. It’s such a simple thing, it’s surprising I
cannot find a way to do this.
I look forward to your suggestions on how I can accomplish this.
Your code works wonderfully to make HTML items vanish. But alas, Freeway Rollovers don’t use the “this.style.display = ‘block’;” code required to bring it back.
Compounding the problem is that I have my HTML item set to “Toggle” (with “Target Show/Hide Layer”). That means I can click my rollover once to make that HTML item appear, then click the same rollover a 2nd time to get the HTML item to vanish. My hope was to maintain that functionality while at the same time add yet another way of making it vanish, a simple click on the HTML item itself. Your code accomplishes that wonderfully, but one of the Freeway actions I have used would need to be modified to allow the “this.style.display = ‘block’;” required to bring the HTML item back.
Additionally, since I will slowly be adding new parts to this map, I wanted to keep my job of setting up new rollovers and targets as simple as possible.