Help with a Wigit Code
3 posters
Page 1 of 1
Help with a Wigit Code
Hi, I made it so on my forum you can make the wigits on the left side appear and go away by clicking. I used this code:
<div id="forum-widget" style="height: 13px; width: 16px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; cursor: pointer; position: absolute; background: url(http://hitskin.com/themes/16/26/54/i_right_arrow.png) no-repeat 0 -13px;" onClick="jQuery('#left').animate({width:'toggle',height:'toggle',opacity:'toggle'},1000); if(my_getcookie('forum-widget')=='0') { my_setcookie('forum-widget','1',0,0); jQuery('#forum-widget').css('background-position','0 -13px'); } else { my_setcookie('forum-widget','0',1,0); jQuery('#forum-widget').css('background-position','0 0px'); }"></div>
The thing is, it only shows the arrow to hide/unhide the wigits when the wigits are hidden. How can I edit the code to make it so there's also an arrow, this> when the wigits are showing?
If you don't know what I mean, look at my forum and the wigits are on the left, the links on my profile
Please help asap!
<div id="forum-widget" style="height: 13px; width: 16px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; cursor: pointer; position: absolute; background: url(http://hitskin.com/themes/16/26/54/i_right_arrow.png) no-repeat 0 -13px;" onClick="jQuery('#left').animate({width:'toggle',height:'toggle',opacity:'toggle'},1000); if(my_getcookie('forum-widget')=='0') { my_setcookie('forum-widget','1',0,0); jQuery('#forum-widget').css('background-position','0 -13px'); } else { my_setcookie('forum-widget','0',1,0); jQuery('#forum-widget').css('background-position','0 0px'); }"></div>
The thing is, it only shows the arrow to hide/unhide the wigits when the wigits are hidden. How can I edit the code to make it so there's also an arrow, this> when the wigits are showing?
If you don't know what I mean, look at my forum and the wigits are on the left, the links on my profile
Please help asap!
Last edited by Jellydonut on August 14th 2012, 4:30 pm; edited 1 time in total
Re: Help with a Wigit Code
Hi Jelly!
If it only shows the arrow when they are hidden how do you hide them to begin with? I looked at your forum and I don't see anyway to hide the widgets.
If it only shows the arrow when they are hidden how do you hide them to begin with? I looked at your forum and I don't see anyway to hide the widgets.
Re: Help with a Wigit Code
You have to click on the top left corner of the login wigit, there's no visible button
Yeah, sort of weird xD that's why I need an arrow there
Yeah, sort of weird xD that's why I need an arrow there
Re: Help with a Wigit Code
Oh yeah no one would even know its there its invisible. You definitely need an arrow.
Good luck on that.
Good luck on that.
Re: Help with a Wigit Code
Okay, can you add this in the starting of the code used in the top widget & check what happens?
- Code:
<br />
Sanket- ForumGuru
- Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai
Re: Help with a Wigit Code
Where would I put the image link to the arrow, though? Right now I can't find a place to put it
Re: Help with a Wigit Code
Did you do the thing as I mentioned?
Sanket- ForumGuru
- Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai
Re: Help with a Wigit Code
Yes, but I don't see how it would put in the image I want, when there's no image code in there.
Re: Help with a Wigit Code
I think hes hoping a break will un-hide a link or something, or a place to link a close button.
Re: Help with a Wigit Code
Oh, okay, sorry for my stubbornness xD
I did put it in though, should something have happened?
edit- I think it actually moved where the 'invisible button' is. It was originally in the top left corner of the wigit, now it's like 10 pixels higher. Right where the button should be... So I think it worked. But how do I get the image in there?
new code:
<br /><div id="forum-widget" style="height: 13px; width: 16px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; cursor: pointer; position: absolute; background: url(http://hitskin.com/themes/16/26/54/i_right_arrow.png) no-repeat 0 -13px;" onClick="jQuery('#left').animate({width:'toggle',height:'toggle',opacity:'toggle'},1000); if(my_getcookie('forum-widget')=='0') { my_setcookie('forum-widget','1',0,0); jQuery('#forum-widget').css('background-position','0 -13px'); } else { my_setcookie('forum-widget','0',1,0); jQuery('#forum-widget').css('background-position','0 0px'); }"></div>
I did put it in though, should something have happened?
edit- I think it actually moved where the 'invisible button' is. It was originally in the top left corner of the wigit, now it's like 10 pixels higher. Right where the button should be... So I think it worked. But how do I get the image in there?
new code:
<br /><div id="forum-widget" style="height: 13px; width: 16px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; cursor: pointer; position: absolute; background: url(http://hitskin.com/themes/16/26/54/i_right_arrow.png) no-repeat 0 -13px;" onClick="jQuery('#left').animate({width:'toggle',height:'toggle',opacity:'toggle'},1000); if(my_getcookie('forum-widget')=='0') { my_setcookie('forum-widget','1',0,0); jQuery('#forum-widget').css('background-position','0 -13px'); } else { my_setcookie('forum-widget','0',1,0); jQuery('#forum-widget').css('background-position','0 0px'); }"></div>
Re: Help with a Wigit Code
The image should have appeared anyways.
Its working on my test forum.
http://troubleshoot.forumotion.net
Did you follow the tutorial properly?
Its working on my test forum.
http://troubleshoot.forumotion.net
Did you follow the tutorial properly?
Sanket- ForumGuru
- Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai
Re: Help with a Wigit Code
Yeah... I'm pretty sure I did
Where should I put the image code in the code?
Where should I put the image code in the code?
Re: Help with a Wigit Code
https://2img.net/i/fa/optimisation_fdf/common/arrow_rtl.png
That was the arrow actually. Add that as the url of the image & it shall work.
If you want that blue one, i suppose you will need to edit the image link you posted.
That was the arrow actually. Add that as the url of the image & it shall work.
If you want that blue one, i suppose you will need to edit the image link you posted.
Sanket- ForumGuru
- Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai
Re: Help with a Wigit Code
It works, but the arrows disappear when the side panel is showing.
Can you copy and paste the exact code that you used, and I can see if that works on my forum?
Can you copy and paste the exact code that you used, and I can see if that works on my forum?
Re: Help with a Wigit Code
Top Widget:
Bottom Widget:
- Code:
<br /><div id="forum-widget" style="cursor: pointer; height: 13px; width: 16px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; position: relative; bottom: -15px; float: right; background: #f5ebf7 url(http://2img.net/i/fa/optimisation_fdf/common/arrow_rtl.png) no-repeat 0 -13px;" onClick="jQuery('#right').animate({width:'toggle',height:'toggle',opacity:'toggle'},1000); if(my_getcookie('forum-widget')=='0') { my_setcookie('forum-widget','1',0,0); jQuery('#forum-widget').css('background-position','0 -13px'); jQuery('#content-container div#content').css('margin-right','189px');} else { my_setcookie('forum-widget','0',1,0); jQuery('#forum-widget').css('background-position','0 0px'); jQuery('#content-container div#content').css('margin-right','0px'); }"></div>
Bottom Widget:
- Code:
<script type="text/javascript"> jQuery('#forum-widget').insertBefore('#right'); if(my_getcookie('forum-widget')=='0') {jQuery('#right').animate({width:'toggle',height:'toggle',opacity:'toggle'},0); jQuery('#forum-widget').css('background-position','0 0px'); jQuery('#content-container div#content').css('margin-right','0px');} </script>
Sanket- ForumGuru
- Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai
Similar topics
» what's the code to customize the quote/code color for phpbb3?
» Tech please respond! What is the border color code/script code
» I add a new Forum widget for my Affiliates code but I want to remove the code that shows there!
» Putting links in posts in [code][/code]
» How to change the standard [code] [/code] font color ?
» Tech please respond! What is the border color code/script code
» I add a new Forum widget for my Affiliates code but I want to remove the code that shows there!
» Putting links in posts in [code][/code]
» How to change the standard [code] [/code] font color ?
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum