The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Hide / show widgets

View previous topic View next topic Go down

Solved Hide / show widgets

Post by IdaTR on November 7th 2014, 11:36 am

http://help.forumotion.com/t132280-show-hide-widgets?highlight=hide+module

Hallo i'm quite interested in this option of hiding and showing the module.
However, is it possible to make it work, if your module content is fixed on the site?
The only particular reason for me wanting this, is due to some problems on mobile devices, since people can't come to zoom into certain things, without the module zooming into and therefore they become unable to read the things on the website.

The website: www.vielamort.net

IdaTR
Forumember

Female Posts : 339
Reputation : 1
Language : Danish, english
Location : Denmark

http://nionevrien.forumq.net/

Back to top Go down

Solved Re: Hide / show widgets

Post by Ange Tuteur on November 7th 2014, 12:17 pm

Hello IdaTR,

See if this is what you want :
Go to administration panel > Modules > javascript codes management > Create a new script

Title : Your choice
Placement : In all the pages
Paste the code below :
Code:
$(function() {
 var hideContent = 'Hide',
  showContent = 'Show';
 
 var bouton = document.createElement('DIV'), left = document.getElementById('left'), c = document.cookie.split(';');
 bouton.setAttribute('style','position:fixed;left:225px;bottom:0;cursor:pointer;z-index:9999;');
 bouton.className = 'toggleWidget';
 bouton.innerHTML = hideContent
 document.body.appendChild(bouton);
 
 for (i=0;i<c.length;i++) {
  if (/widgetHidden/.test(c[i])) {
  bouton.style.left = 0;
  left.style.left = '-250px';
  bouton.innerHTML = showContent;
  }
 }
 bouton.onclick = function() {
  if (Number(left.style.left.replace(/px/,'')) != -250) {
  var date = new Date();
  date.setTime(date.getTime() + (365*24*60*60*1000));
  document.cookie = 'widget_state=widgetHidden; expires='+date.toGMTString()+';';
  bouton.style.left = 0;
  left.style.left = '-250px';
  bouton.innerHTML = showContent;
  }
  else {
  var date = new Date();
  date.setTime(date.getTime() + (365*24*60*60*1000));
  document.cookie = 'widget_state=widgetShown; expires='+date.toGMTString()+';';
  bouton.style.left = '225px';
  left.style.left = 0;
  bouton.innerHTML = hideContent;
  }
 }
});

At the top you can modify some variables :
Code:
var hideContent = 'Hide',
  showContent = 'Show';

hideContent is the content displayed on the button when the widgets are shown.
showContent is the content displayed on the button when the widgets are hidden.

The button itself is just text, something quick I threw together. It should display at the bottom right of your widgets. You can style it with this CSS rule :
Code:
.toggleWidget {

}

If you don't want to use text, but an image, you can use HTML in the variables. For example :
Code:
var hideContent = '<img src="/myimg1.gif"/>',
  showContent = '<img src="/myimg2.gif"/>';

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Hide / show widgets

Post by IdaTR on November 7th 2014, 12:51 pm

Hello, thank you for your answer, as it seems right now, it's not shown at all.
Am I supposed to delete the widgets with hide/show options, and throw in the java, or do i need both?

IdaTR
Forumember

Female Posts : 339
Reputation : 1
Language : Danish, english
Location : Denmark

http://nionevrien.forumq.net/

Back to top Go down

Solved Re: Hide / show widgets

Post by APE on November 7th 2014, 5:49 pm

You have to keep both codes as the system looks for the widgets code Wink





APE
Manager
Manager

Male Posts : 8319
Reputation : 716
Language : fluent in dork / mumbojumbo & English haha
Location : STUCK IN FORUMOTIONS SERVERS HELP ME !!!!!!

http://chatworld.forumotion.co.uk/

Back to top Go down

Solved Re: Hide / show widgets

Post by Ange Tuteur on November 7th 2014, 10:43 pm

Sorry, I made a mistake in the script I gave you. Try now :
Code:
$(function() {
  var hideContent = 'Hide',
      showContent = 'Show';
 
  var bouton = document.createElement('DIV'), left = document.getElementById('left'), c = document.cookie.split(';');
  if (!left) return;
  bouton.setAttribute('style','position:fixed;left:225px;bottom:0;cursor:pointer;z-index:9999;');
  bouton.className = 'toggleWidget';
  bouton.innerHTML = hideContent;
  document.body.appendChild(bouton);
 
  for (i=0;i<c.length;i++) {
    if (/widgetHidden/.test(c[i])) {
      bouton.style.left = 0;
      left.style.left = '-250px';
      bouton.innerHTML = showContent;
    }
  }
  bouton.onclick = function() {
    if (Number(left.style.left.replace(/px/,'')) != -250) {
      var date = new Date();
      date.setTime(date.getTime() + (365*24*60*60*1000));
      document.cookie = 'widget_state=widgetHidden; expires='+date.toGMTString()+';';
      bouton.style.left = 0;
      left.style.left = '-250px';
      bouton.innerHTML = showContent;
    }
    else {
      var date = new Date();
      date.setTime(date.getTime() + (365*24*60*60*1000));
      document.cookie = 'widget_state=widgetShown; expires='+date.toGMTString()+';';
      bouton.style.left = '225px';
      left.style.left = 0;
      bouton.innerHTML = hideContent;
    }
  }
});

Also you don't need the hide/show widgets. The script I gave you should create a button that will display at the bottom right of your widgets.

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Hide / show widgets

Post by IdaTR on November 7th 2014, 11:21 pm

it doesn't do much, would you like a test account to try look at it for yourself?

IdaTR
Forumember

Female Posts : 339
Reputation : 1
Language : Danish, english
Location : Denmark

http://nionevrien.forumq.net/

Back to top Go down

Solved Re: Hide / show widgets

Post by Ange Tuteur on November 8th 2014, 12:33 am

Are the texts by the bottom of the widgets ?



Clicking it will toggle the widget panel.

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Hide / show widgets

Post by IdaTR on November 8th 2014, 12:49 pm

THERE!! haha i see it now (:!
THX!!

IdaTR
Forumember

Female Posts : 339
Reputation : 1
Language : Danish, english
Location : Denmark

http://nionevrien.forumq.net/

Back to top Go down

Solved Re: Hide / show widgets

Post by SLGray on November 8th 2014, 6:36 pm

Topic solved and archived



When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35641
Reputation : 2374
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum