|
Hide sidebar from Thread view. [IF]
|
|
Topic Started: Jun 19 2013, 01:42 PM (1,120 Views)
|
|
purplemix
|
Jun 19 2013, 01:42 PM
Post #1
|
- Posts:
- 4
- Group:
- Members
- Member
- #609,410
- Joined:
- June 19, 2013
|
Hello!
Usually i've been able to find solutions about various coding problems by myself before, but this time I'm complete stuck with my issue: The forum looks completey fine in the width with the sidebars aside, but when i enter to view a thread it screws up and get wider. Since I couldn't find out how to make the threads smaller without messing with the rest of the forum, my idea was to remove/hide the siderbars only when you view a thread.
Link to website: http://z13.invisionfree.com/Reunion_eu/index.php? Link to view test thread: http://z13.invisionfree.com/Reunion_eu/index.php?showtopic=1&st=0&#last
I did find some javascript codes from peoples who had a similiar problem, but there isn't any "sidebar" codes in my css :S Anyhow, i hope someone understood what I just wrote, and could give me a quick answer!
css:
- Code:
-
html { overflow-x: auto; }
form { display:inline; } img { vertical-align:middle; border:0px } BODY { position: absolute; font-family: Verdana; font-size: 10px; letter-spacing: 0.5px; color: #333333; margin:2.5% 2.5% 2.5% 31%; background-color:#FFffff; background-image: url(http://i858.photobucket.com/albums/ab144/purplemix/111_zpsa8e242aa.jpg); background-repeat: no-repeat; background-attachment: fixed; background-position: absolute; background-size: 62%; } TABLE, TR, TD { font-family: Verdana; letter-spacing: 0.5px; font-size: 10px; color: #333333; } a:link, a:visited, a:active { font-family: Verdana; font-size: 10px; text-transform: normal; text-decoration: none; color: #333333; } a:hover { font-family: Verdana; font-size: 10px; text-transform: normal; text-decoration: none; color: #9d3329; transition-duration: 0.5s; -moz-transition-duration: 0.5s; -webkit-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-timing-function: ease; }
fieldset.search { background-color: #efefef; border: 2px solid #F7D4BE } label { cursor:pointer; }
img.attach { border:2px outset #EEF2F7;padding:2px }
.googleroot { padding:6px; line-height:130% } .googlechild { padding:6px; margin-left:30px; line-height:130% } .googlebottom, .googlebottom a:link, .googlebottom a:visited, .googlebottom a:active { font-size:11px; color: #3A4F6C; } .googlish, .googlish a:link, .googlish a:visited, .googlish a:active { font-size:14px; font-weight:bold; color:#00D; } .googlepagelinks { font-size:1.1em; letter-spacing:1px } .googlesmall, .googlesmall a:link, .googlesmall a:active, .googlesmall a:visited { font-size:10px; color:#333333}
li.helprow { padding:0px; margin:0px 0px 10px 0px } ul#help { padding:0px 0px 0px 15px }
option.cat { font-weight:bold; } option.sub { font-weight:bold;color:#555 } .caldate { text-align:right;font-weight:bold;font-size:11px;color:#FFFFFF;background-color:#B3D1B2;padding:4px;margin:0px }
.warngood { color:green } .warnbad { color:red }
#padandcenter { margin-left:auto;margin-right:auto;text-align:center;padding:14px 0px 14px 0px }
#profilename { font-size:28px; font-weight:bold; } #calendarname { text-align: center; background-color: #B3D1B2; border-bottom: 5px solid #dadada ; color:#333333; font-weight:none;font-family:Times New Roman, Times, serif; font-size: 15px; text-transform: uppercase; padding: 0px 0px 0px 3px;margin-top:1px }
#photowrap { padding:6px; } #phototitle { font-size:24px; border-bottom:1px solid black } #photoimg { text-align:center; margin-top:15px }
#ucpmenu { width: 200px; background-color: #efefef} #ucpmenu p { padding:2px 5px 6px 9px;margin:0px; } #ucpcontent { background-color: #efefef; border:0px;line-height:150%; width:auto } #ucpcontent p { padding:10px;margin:0px; }
#ipsbanner { position:absolute;top:1px;right:5%; } #logostrip { background-color: #efefef; border-bottom: 2px solid #F7D4BE; padding:0px;margin:0px; } #submenu { display:none; } #submenu a:link, #submenu a:visited, #submenu a:active { display:none; } #userlinks { opacity: 0.95; position:fixed; top: 0px; right: 0; width: auto; border-radius: 0px 0px 0px 15px; background-color: #efefef; border-bottom: 2px solid #dadada; padding-left:10px; } #sub_dos { text-align: center; background-color: #7e7e7e; border-bottom: 5px solid #9d3329; color:#fff; font-weight:none;font-family:Century gothic; font-size: 15px; text-transform: uppercase; padding: 3px 3px 3px 3px;margin-top:1px; } #sub_dos a:link, #submenu a:visited, #submenu a:active { text-align: center; background-color: #transparent; color:#fff; font-weight:none;font-family:Century gothic; font-size: 15px; text-transform: uppercase; padding: 0px 15px 0px 0px;margin-top:1px; } #sub_dos a:visited { color:#fff;} #sub_dos a:hover { text-align: center; background-color: #7e7e7e; border-bottom: 0px solid #009aa8; color:#9d3329; font-weight:none;font-family:Century gothic; font-size: 15px; text-transform: uppercase; padding: 0px 15px 0px 0px; margin-top:1px; transition-duration: 0.5s; -moz-transition-duration: 0.5s; -webkit-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-timing-function: ease; }
#navstrip { font-family: Verdana; font-size: 10px; text-transform: normal; text-decoration: none; color: #9d3329; transition-duration: 0.5s; -moz-transition-duration: 0.5s; -webkit-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-timing-function: ease; }
.activeuserstrip { background-color:#FFF2D1; padding:6px; }
.pformstrip { font-family: Verdana; font-size: 10px; text-transform: normal; font-weight:normal; text-decoration: none; color: #7e7e7e; padding: 3px; line-height: 100%; background-color: #dadada } .pformleft { background-color: #efefef; padding:6px; margin-top:1px;width:25%; } .pformleftw { background-color: #efefef; padding:6px; margin-top:1px;width:40%; } .pformright { background-color: #efefef; padding:6px; margin-top:1px; }
.post1 { background-color: #efefef} .post2 { background-color: #efefef} .postlinksbar { text-align: right; background-color: #dadada ; color:#402410; font-weight:none;font-family:Times New Roman, Times, serif; font-size: 10px; text-transform: uppercase; padding: 0px 3px 0px 0px;margin-top:1px }
.row1 { background-color: #efefef; border: 2px solid #dadada } .row2 { background-color: #efefef} .row3 { background-color: #efefef} .row4 { background-color: #efefef}
.darkrow1 { background-color: #e1e1e1; color:#333333; } .darkrow2 { background-color: #dadada ; color:#333333; } .darkrow3 { background-color: #dadada ; color:#333333; }
.hlight { background-color: #DFE6EF } .dlight { background-color: #EEF2F7 }
.titlemedium { font-weight:normal; font-family: Verdana; font-size: 10px; text-transform: normal; text-decoration: none; color: #7e7e7e; padding: 3px; line-height: 100%; background-color: #dadada } .titlemedium a:link, .titlemedium a:visited, .titlemedium a:active { text-decoration: none; color: #FFFFFF }
.maintitle { text-align: center; background-color: #7e7e7e; border-bottom: 5px solid #9d3329; color:#fff; font-weight:none;font-family:Century gothic; font-size: 15px; text-transform: uppercase; padding: 3px 3px 3px 3px;margin-top:1px } .maintitle a:link, .maintitle a:visited, .maintitle a:active { color:#fff; font-weight:none;font-family:Century gothic; font-size:15px; text-transform: uppercase; padding:0px;margin-top:1px } .maintitle a:hover { color:#fff; font-weight:none;font-family:Century gothic; font-size: 15px; text-transform: uppercase; padding:0px;margin-top:1px }
.maintitle img { display:none; }
.plainborder { border:1px solid #efefef;background-color:#efefef} .tableborder { border:0px solid #000; margin:0px; width:100%; } .tablefill { border:1px solid #efefef;background-color:#FFFCF2;padding:6px; } .tablepad { background-color:#efefef;padding:6px; text-align: justify; } .tablebasic { padding:0px 0px 0px 0px; margin:0px; border:0px }
.wrapmini { display:none; } .pagelinks { float:left;line-height:1.2em;width:35% }
.desc { font-family:Verdana; font-size:10px; color:#402410; letter-spacing: 0.5px; text-decoration: none; text-transform: none; } .edit { font-size: 10px }
.signature { font-family:Verdana; font-size:10px; color:#402410; letter-spacing: 0.5px; text-decoration: none; text-transform: none; } .postdetails { font-size: 10px } .postcolor { font-size: 10px; line-height: 160% }
.normalname { font-family: Times New Roman, Times, serif; font-size: 10px; text-transform: uppercase; text-decoration: none; color: #402410 } .normalname a:link, .normalname a:visited, .normalname a:active { font-family: Times New Roman, Times, serif; font-size: 10px; text-transform: uppercase; text-decoration: none; color: #402410 } .unreg { font-family: Times New Roman, Times, serif; font-size: 10px; text-transform: uppercase; text-decoration: none; color: #402410 }
.searchlite { font-weight:bold; color:#F00; background-color:#FF0 }
#QUOTE { font-family: Verdana; font-size: 10px; letter-spacing: 0.5px; color: #333333; border: 1px solid #333; padding-top: 7px; padding-right: 7px; padding-bottom: 7px; padding-left: 7px; background-color: #dadada; } #CODE { font-family: Verdana; font-size: 10px; letter-spacing: 0.5px; color: #333333; border: 1px solid #333; padding-top: 7px; padding-right: 7px; padding-bottom: 7px; padding-left: 7px; background-color: #dadada; }
.copyright { font-family:Times New Roman, Times, serif; font-size: 10px; color:#FFFFFF;}
.codebuttons { font-family: Verdana; font-size: 10px; letter-spacing: 0.5px; color: #333333; border: 1px solid #333; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px; background-color: #efefef; } .forminput, .textinput, .radiobutton, .checkbox { font-family: Verdana; font-size: 10px; letter-spacing: 0.5px; color: #333333; border: 1px solid #333; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px; background-color: #efefef; }
.thin { padding:6px 0px 6px 0px;line-height:140%;margin:2px 0px 2px 0px; }
.purple { color:purple;font-weight:bold } .red { color:red;font-weight:bold } .green { color:green;font-weight:bold } .blue { color:blue;font-weight:bold } .orange { color:#F90;font-weight:bold }
#ipbwrapper { margin-left:auto; margin-right:auto; width: 900px; background-color: #c7c7c7; padding: 10px; border: 8px solid #7e7e7e; } #maintable {width: 900px; background-color: #ffffff; padding:5px; border: 8px solid #444; opacity: 0.95; }
Header & body:
- Code:
-
<center><table> <div align="center"> <tr><td id="maintable"> <table class="tableborder"> <tr> <div id="sub_dos"><a href="http://z13.invisionfree.com/Reunion_eu/index.php?">Home</a> <a href="http://z13.invisionfree.com/Reunion_eu/index.php?c=739912">Forums</a> <a href="http://z3.invisionfree.com/Reunion_eu/index.php?act=Members">Members</a> <a href="http://z13.invisionfree.com/Reunion_eu/index.php?showforum=8">Apply to Reunion</a> </div> </td></tr> <tr> <td class="tablepad" width="60%" valign="top"> <center> <marquee behavior="scroll" direction="left" onmouseover="this.stop();" onmouseout="this.start();" scrollamount="5"><img src="http://i41.tinypic.com/slqut0.png" border="0" alt="Image and video hosting by TinyPic"> <img src="http://i41.tinypic.com/15zquzd.png" border="0" alt="Image and video hosting by TinyPic"> <img src="http://i44.tinypic.com/2r2w1za.png" border="0" alt="Image and video hosting by TinyPic"> <img src="http://i43.tinypic.com/nx3wqh.png" border="0" alt="Image and video hosting by TinyPic"> <img src="http://i44.tinypic.com/2v0evpu.png" border="0" alt="Image and video hosting by TinyPic"></marquee> </center></td> <td class="tablepad" width="40%" valign="top"> <center><img src="http://i39.tinypic.com/hs2ujk.png" border="0" alt="Image and video hosting by TinyPic"></center> <br>Aliquam est diam, viverra in sollicitudin sit amet, dignissim ut neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas quam risus, porttitor eu commodo id, euismod id purus. Aliquam est diam, viverra in sollicitudin sit amet, dignissim ut neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. <br><br> Aliquam est diam, viverra in sollicitudin sit amet, dignissim ut neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas quam risus, porttitor eu commodo id, euismod id purus. Aliquam est diam, viverra in sollicitudin sit amet, dignissim ut neque. Lorem ipsum dolor sit amet, consectetur adipiscing elit. </td></tr></table></div> <br> <div class="tableborder">
<% BOARD HEADER %> <% NAVIGATION %> <table width="100%" class='0' cellspacing="5" cellpadding="1"> <tr> <td width="100%" class='0' valign="top"> <% BOARD %> <!--SPACER--> <td width="5" class='0'> </td> <td width="260" class='0' valign="top">
<center> <div class='maintitle'> GUILD STATUS </div> <DIV class="tablepad"><span class='desc'> <center><img src="http://i42.tinypic.com/f9qr1z.png" border="0" alt="Image and video hosting by TinyPic"></center> </span></div> </div> <br /></center>
<center> <div class='maintitle'> PROGRESSION </div> <div class="tablepad"><span class='desc'> <center><img src="http://i43.tinypic.com/nbohv5.png" border="0" alt="Image and video hosting by TinyPic"> <p><img src="http://i40.tinypic.com/2r5agdg.png" border="0" alt="Image and video hosting by TinyPic"> <p><img src="http://i44.tinypic.com/2lscil4.png" border="0" alt="Image and video hosting by TinyPic"> <p><img src="http://i44.tinypic.com/2po1fyp.png" border="0" alt="Image and video hosting by TinyPic"></center> </span></div> </div> <br /></center>
<center> <div class='maintitle'> THE CREW </div> <div class="tablepad"><span class='desc'> <center>GUILDMASTER <br>PIC <p> CAPTAIN <br>PIC> OFFICERS <br>PIC> </center> </span></div> </div> <br /></center>
<center> <div class='maintitle'> Credits </div> <div class='tablepad'><span class='desc'> Sidebar: Dana @ <a href="http://s8.invisionfree.com/redcarpetrebellion" target="new">RCR</a> <br> Header: Mimmy @ <a href="http://s8.invisionfree.com/redcarpetrebellion" target="new">RCR</a> <br> Coding Help: <a href="http://s8.invisionfree.com/redcarpetrebellion" target="new">RCR</a> <br> Skin: Vagrant @ <a href="http://z10.invisionfree.com/CAUTIONTOTHEWIND" target="new">Caution! 2.0</a> </span></div> </div> <br /></center>
<img src='http://i1.ifrm.com/style_images/1/spacer.gif' alt='' width='190' height='1' /> </td> </tr> </table> <% STATS %>
// purplemix
|
|
|
| |
|
Cory
|
Jun 20 2013, 05:51 AM
Post #2
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
- Code: HTML
-
<td width="260" class='0' valign="top"> Change that to this:- Code: HTML
-
<td id="sidebar" width="260" class='0' valign="top"> Admin CP Skinning & Styles Board Wrappers Footer- Code:
-
<script type="text/javascript"> //<![CDATA[ if (location.href.indexOf('showtopic=') !== -1) { document.getElementById('sidebar').style.display = 'none'; } //]]> </script>
|
|
|
| |
|
purplemix
|
Jun 20 2013, 06:16 AM
Post #3
|
- Posts:
- 4
- Group:
- Members
- Member
- #609,410
- Joined:
- June 19, 2013
|
You're a genious Cory! Thank you so much for coming to my rescue, hehe! 
Another question though - would it also be possible to hide the sidebar in active topics? Link: http://z13.invisionfree.com/Reunion_eu/index.php?showforum=7
// purplemix
|
|
|
| |
|
Cory
|
Jun 20 2013, 07:29 AM
Post #4
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
- Code:
-
if (location.href.indexOf('showtopic=') !== -1) { Change that to this:- Code:
-
if (location.href.indexOf('showtopic=') !== -1 || location.href.indexOf('showforum=') !== -1) {
|
|
|
| |
|
purplemix
|
Jun 20 2013, 09:26 AM
Post #5
|
- Posts:
- 4
- Group:
- Members
- Member
- #609,410
- Joined:
- June 19, 2013
|
Thanks alot! Problems solved
|
|
|
| |
|
purplemix
|
Jul 7 2013, 11:51 AM
Post #6
|
- Posts:
- 4
- Group:
- Members
- Member
- #609,410
- Joined:
- June 19, 2013
|
Found one more thing though - I would also like to remove/hide the sidebar when you edit a post aswell, if that's possible?
|
|
|
| |
|
Cory
|
Jul 9 2013, 01:20 AM
Post #7
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
- Code:
-
if (location.href.indexOf('showtopic=') !== -1 || location.href.indexOf('showforum=') !== -1) { Change that to this:- Code:
-
if (location.href.indexOf('showtopic=') !== -1 || location.href.indexOf('showforum=') !== -1 || location.href.indexOf('?act=Post&CODE=08') !== -1) {
|
|
|
| |
| 1 user reading this topic (1 Guest and 0 Anonymous)
|