The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Help with a Wigit Code

3 posters

Go down

Help with a Wigit Code  Empty Help with a Wigit Code

Post by Jellydonut August 14th 2012, 2:34 am

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> Help with a Wigit Code  I_left_arrow 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
Jellydonut
Jellydonut
Forumember

Female Posts : 572
Reputation : 27
Language : English
Location : Illinois

http://www.googlesclub.forumotion.com

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by runawayhorses August 14th 2012, 3:29 am

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.
avatar
runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 166
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by Jellydonut August 14th 2012, 4:29 am

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
Jellydonut
Jellydonut
Forumember

Female Posts : 572
Reputation : 27
Language : English
Location : Illinois

http://www.googlesclub.forumotion.com

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by runawayhorses August 14th 2012, 4:36 am

Oh yeah no one would even know its there its invisible. You definitely need an arrow.

Good luck on that. Smile
avatar
runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 166
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by Sanket August 14th 2012, 5:06 am

Okay, can you add this in the starting of the code used in the top widget & check what happens?
Code:
<br />
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by Jellydonut August 14th 2012, 4:32 pm

Where would I put the image link to the arrow, though? Right now I can't find a place to put it
Jellydonut
Jellydonut
Forumember

Female Posts : 572
Reputation : 27
Language : English
Location : Illinois

http://www.googlesclub.forumotion.com

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by Sanket August 15th 2012, 10:30 am

Did you do the thing as I mentioned?
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by Jellydonut August 18th 2012, 12:19 am

Yes, but I don't see how it would put in the image I want, when there's no image code in there.
Jellydonut
Jellydonut
Forumember

Female Posts : 572
Reputation : 27
Language : English
Location : Illinois

http://www.googlesclub.forumotion.com

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by runawayhorses August 18th 2012, 2:58 am

I think hes hoping a break will un-hide a link or something, or a place to link a close button.
avatar
runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 166
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by Jellydonut August 18th 2012, 5:53 pm

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>
Jellydonut
Jellydonut
Forumember

Female Posts : 572
Reputation : 27
Language : English
Location : Illinois

http://www.googlesclub.forumotion.com

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by Sanket August 20th 2012, 9:59 am

The image should have appeared anyways.

Its working on my test forum.
http://troubleshoot.forumotion.net
Did you follow the tutorial properly?
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by Jellydonut September 8th 2012, 3:25 am

Yeah... I'm pretty sure I did
Where should I put the image code in the code?
Jellydonut
Jellydonut
Forumember

Female Posts : 572
Reputation : 27
Language : English
Location : Illinois

http://www.googlesclub.forumotion.com

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by Sanket September 9th 2012, 8:00 pm

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.
Sanket
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by Jellydonut September 11th 2012, 1:59 am

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?
Jellydonut
Jellydonut
Forumember

Female Posts : 572
Reputation : 27
Language : English
Location : Illinois

http://www.googlesclub.forumotion.com

Back to top Go down

Help with a Wigit Code  Empty Re: Help with a Wigit Code

Post by Sanket September 12th 2012, 7:05 pm

Top 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
Sanket
ForumGuru

Male Posts : 48766
Reputation : 2830
Language : English
Location : Mumbai

Back to top Go down

Back to top


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