show and hide text

Questions related to the Responsive Web Design tools of WYSIWYG Web Builder.
Forum rules
PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/respon ... esign.html
Please read this first before posting any questions! Also check out the example project to get an idea how the RWD concept works.

Responsive Web Design FAQ:
http://wysiwygwebbuilder.com/forum/view ... 10&t=63817
Post Reply
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

show and hide text

Post by petejos »

Hi Pablo,

I am trying to create when I click on a link it will show or hide text/layout grid. I tried using event or condition but it doesn't work. can you please point me to the correct way of doing it please? Thanks.
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

You can implement this with events.

Related tutorial:
https://www.wysiwygwebbuilder.com/more_events.html

If this does not work for you then please share a demo project so I can see all your settings.
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

I need help Pablo. The event is not working. It won't work if I hide the text upon the page loading.

Basically I want the text to appear only when I mouseover the "info" icon then disappear when mouse out. Please visit the following testing page I created. I didn't uncheck the visible box because if I uncheck it, it won't display any text when I mouseover the "info" icon. Could you please advise me? Thanks.

http://www.goec.com.au/goec2/page3.html
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

You must uncheck 'visible' otherwise the text will not be hidden.

Note that I cannot see your settings based on the HTML code. I need the project file.
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

Hi Pablo,

I unchecked but it didn't work. The following is my project file. THanks.

http://goec2.com.au/test2.wbs
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

Hi Pablo,

Help to check this project too. I want to display text 2 when the mouseover the "info" icon. Thanks.

http://goec2.com.au/ministryserving.wbs
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

When an object is inside a layout grid you should use the action 'show with effects' instead of 'show'. This is related to the way layout grids hide objects (display vs visibility).
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

Thanks Pablo. I think it is working. I have done the show with effect as you suggested but I hide the text on the second click without effect and it seems works fine for me. Can you please help me to check whether the way I did is correct? Thanks.

http://goec2.com.au/ministryserving.wbs
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

I recommend to use the same combination show/hide vs showwitheffect/hidewitheffects otherwise the object's visibility state may get out of sync.
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

Will do. Thanks Pablo
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

Hi Pablo,

I noticed some problem. Can you check for me whether I have done anything wrong? If i changed both hide and show with effect, it seems just flashing instead of show on 1st click then hide of 2nd click. Thanks.

http://goec2.com.au/ministryserving.wbs
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

You have used the 'oncilck' event twice with different action for the same object.
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

Thanks Pablo. What would you suggest me to do if I want to have 1st click to show then 2nd click to hide it? tq
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

Use 'toggle' instead of show/hide.
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

Pablo wrote: Sun Oct 13, 2019 10:46 am Use 'toggle' instead of show/hide.
Thanks Pablo. Are you saying use toggle for both show and hide?
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

Yes, toggle is a replacement for show/hide.
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

Pablo wrote: Mon Oct 14, 2019 5:58 am Yes, toggle is a replacement for show/hide.
Thanks Pablo. But I can't use the onclick event twice. How can I go around it? Thanks.
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

You will only need one 'onclick' event. Toggle handles both show and hide
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

got it. thansk pablo
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

Hi pablo,

Sorry I have to ask this questions again.

When I have text 1 and text 2 and text 3. How could I use toggle to hide text 2 and text 3 when I click on text 1. How could I hide text 1 and 2 when I click on text 3?

Thanks.
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

If you have more than two combination then toggle will not work. In that case you will need to write a script to keep track of the states.
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

Thanks Pablo. I have no idea on scripting at all. Do you have any recommendation or any extension that I could use? Thanks.
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

I'm sorry, I don't think there is an extension for this.
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

Hi Pablo,

I need another help again. The following is my project file. What I need to do is when I select "Yes" in combobox 1, I would like to show layout grid 21. I already set the condition but it just doesn't work. Please help. Thanks.

http://goec2.com.au/ministryserving.wbs
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

I do not see conditions in your project. Where did you add them?
And where is LayoutGrid21?

Also, can you please remove all extensions before sahre a projetc, otherwise I cannot open the project.
Hbrownell
 
 
Posts: 143
Joined: Fri Dec 06, 2019 3:58 pm
Location: Kentucky
Contact:

Re: show and hide text

Post by Hbrownell »

So, if I use "onmouseenter", I can get the text to pop up, and then with "onmouseleave" the text goes away, but it never repeats after that. So, I can't make it pop up or go away on command of the mouse entering or leaving. Am I missing a beat here?

Yah, this is hit and miss. Now I can't get it to hide when the mouse leaves. Is there a setting somewhere I might have missed to keep this more predictable?

Here is the html (copied from inspecting the page), but I use the option fields to make all this work. but, maybe you can spot something that would be related?

</div>
<div id="wb_LayoutGrid1">
<div id="LayoutGrid1">
<div class="row">
<div class="col-1">
<div id="wb_LayoutGrid2">
<div id="LayoutGrid2">
<div class="row">
<div class="col-1">
<div id="wb_Text1" onmouseenter="ShowObjectWithEffect('wb_HideTxt', 1, 'scale', 2000);return false;" onmouseout="ShowObjectWithEffect('wb_HideTxt', 0, 'scale', 2000);return false;">
<span style="color:#000000;font-family:Arial;font-size:27px;"><strong>TEXT</strong></span>
</div>
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

'onmouseleave' should work
https://www.w3schools.com/jsref/event_onmouseleave.asp

Note that this is standard HTML/browser functionality. So, if it does not work then there is most likely a conflict somewhere.
petejos
 
 
Posts: 155
Joined: Wed Aug 22, 2012 11:43 am

Re: show and hide text

Post by petejos »

hi Pablo,

Can you login to the following resources page
http://goec2.com.au/login.php

Login: goec
password: 1234

under the resource pages, click the menu on the left. I am trying to show and hide the content but it doesn't really work. Any idea why is it now? Thanks.
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: show and hide text

Post by Pablo »

What exactly does not work?
Can you please be more specific?
What did you do and what did you expect to happen?

Note that I cannot see what you have done based on the published files.
Post Reply