vb.org Archive
Page 36 of 39 « First 263435 36 3738 Last »
Show 40 post(s) from this thread on one page

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vBulletin 3.8 Template Modifications (https://vborg.vbsupport.ru/forumdisplay.php?f=236)
-   -   Miscellaneous Hacks - DJ's Dynamic Tab Content for Postbit_Legacy (https://vborg.vbsupport.ru/showthread.php?t=184136)

grey_goose 12-12-2009 10:17 PM
I love this mod, but when you click on a 'dot', the screen 'jumps' to the top of the post rather than just dropping the bottom. How to fix this behavior?

grey_goose 12-12-2009 10:54 PM
*facepalm*

I misnumbered a "tabX$post[postid]" :)

Digital Jedi 12-15-2009 04:14 AM
Quote:
Originally Posted by tipoboy (Post 1929022)
DJ everything in my postbit_legacy is centered apart from the dots. I've tried several methods of trying to get it to align correctly including all the example's here.

The code i posted centers the dots in IE but when viewing in FF the dots are still left aligned.

Any suggestions?

TIA dave :D
The last time we got the dots to center for another user I had him add a style tag to the opening DIV container. It was a last resort at that time:

Code:
<div id="postbittabs$post[postid]" class="djdot" style="text-align:center;">

tipoboy 12-15-2009 11:11 AM
Quote:
Originally Posted by Digital Jedi (Post 1930948)
The last time we got the dots to center for another user I had him add a style tag to the opening DIV container. It was a last resort at that time:

Code:
<div id="postbittabs$post[postid]" class="djdot" style="text-align:center;">
thanks for the reply, i did try that DJ yet its still not centering in FF for some strange reason, here's screeny's to see:

IE8:

https://vborg.vbsupport.ru/

FF screeny:

https://vborg.vbsupport.ru/

any suggestions as to why this would be?

here's what i've done with my CSS file too:

Code:
.djdot{
font: bold 13px Arial;
width: 100%; /*leave this value as is in most cases*/
margin: auto;
}
.djdot ul{
 padding: 0;
}
.djdot ul li{
 display: inline;
 background:  url(djdotbg.png) center center;
 background-repeat: no-repeat;
 float: left;
}
.djdot ul li a{
 float: left;
 color: white;
 padding: 5px 11px;
 text-decoration: none;
 background:  url(djdotbg.png) center center;
 background-repeat: no-repeat;
 margin: auto;
}
.djdot ul li a:visited{
color: white;
background:  url(djdotbg.png) center center;
background-repeat: no-repeat;
}
.djdot ul li a.selected{
color: white;
padding-top: 6px; /*shift text down 1px*/
padding-bottom: 4px;
background: url(djdotbg2.png) center center;
background-repeat: no-repeat;
}

.tabcontentstyle{ /*style of tab content oontainer*/
border: 1px solid gray;
width: 450px;
margin-bottom: 1em;
padding: 10px;
}
.tabcontent{
display:none;
}

/* removing the active/focus dotted border */
#djdot_c {
  list-style-type:none;
  padding:0;
  width:36em;
  height:5em;
  margin:0 auto;
  }
#djdot_c li {
  display:block;
  width:7em;
  height:2em;
  float:left;
  margin-right:0.2em;
  }
#djdot_c a {
  display:block;
  width:7em;
  height:2em;
  position:relative;
  text-decoration:none;
  }
#djdot_c a em {
  font-style:normal;
  color:#000;
  display:block;
  width:7em;
  height:1.5em;
  border-bottom:0.5em solid #000;
  position:absolute;
  top:0;
  left:0;
  cursor:pointer;
  }
#djdot_c a:hover {
  color:#c00;
  }
#djdot_c a:hover em {
  border-bottom:0.5em solid #c00;
  }

#djdot_c a:active, #djdot_c a:focus {
  /* reduce the link size to zero when the link is in the
  active/focus state.
  This literally removes the dotted border which is ONLY applied
  to the link itself and not any containing elements WHEN THOSE
  ELEMENTS HAVE A POSITION ABSOLUTE! */
  width:0; height:0;
  outline:0; /* for browsers that understand */
  }
/* adding the active/focus state */
#djdot_d {
  list-style-type:none;
  padding:0;
  width:36em;
  height:5em;
  margin:0 auto;
  }
#djdot_d li {
  display:block;
  width:7em;
  height:2em;
  float:left;
  margin-right:0.2em;
  }
#djdot_d a {
  display:block;
  width:7em;
  height:2em;
  position:relative;
  text-decoration:none;
  }
#djdot_d a em {
  display:block;
  font-style:normal;
  width:7em;
  height:1.5em;
  color:#000;
  border-bottom:0.5em solid #000;
  position:absolute;
  top:0;
  left:0;
  cursor:pointer;
  }
#djdot_d a:hover {
  color:#c00;
  }
#djdot_d a:hover em {
  border-bottom:0.5em solid #c00;
  }
#djdot_d a:active, #djdot_d a:focus {
  width:0;
  height:0;
  outline:0; /* for browsers that understand */
  }
#djdot_d a:active em, #djdot_d a:focus em {
  /* change the em bottom border and text to blue on
  active/focus thus giving a suitable alternative to
  the dotted border */
  border-bottom:0.5em solid #00c;
  color:#00c;
  outline:0; /* for browsers that understand */
  }
 
@media print {
.tabcontent {
display:block !important;
}
}

Digital Jedi 01-09-2010 11:36 PM
Quote:
Originally Posted by tipoboy (Post 1931054)
thanks for the reply, i did try that DJ yet its still not centering in FF for some strange reason, here's screeny's to see:

IE8:

http://www.crueluniverse.net/pictures/iescreeny.png

FF screeny:

http://www.crueluniverse.net/pictures/ffscreeny.png

any suggestions as to why this would be?

here's what i've done with my CSS file too:

Code:
.djdot{
font: bold 13px Arial;
width: 100%; /*leave this value as is in most cases*/
margin: auto;
}
.djdot ul{
 padding: 0;
}
.djdot ul li{
 display: inline;
 background:  url(djdotbg.png) center center;
 background-repeat: no-repeat;
 float: left;
}
.djdot ul li a{
 float: left;
 color: white;
 padding: 5px 11px;
 text-decoration: none;
 background:  url(djdotbg.png) center center;
 background-repeat: no-repeat;
 margin: auto;
}
.djdot ul li a:visited{
color: white;
background:  url(djdotbg.png) center center;
background-repeat: no-repeat;
}
.djdot ul li a.selected{
color: white;
padding-top: 6px; /*shift text down 1px*/
padding-bottom: 4px;
background: url(djdotbg2.png) center center;
background-repeat: no-repeat;
}

.tabcontentstyle{ /*style of tab content oontainer*/
border: 1px solid gray;
width: 450px;
margin-bottom: 1em;
padding: 10px;
}
.tabcontent{
display:none;
}

/* removing the active/focus dotted border */
#djdot_c {
  list-style-type:none;
  padding:0;
  width:36em;
  height:5em;
  margin:0 auto;
  }
#djdot_c li {
  display:block;
  width:7em;
  height:2em;
  float:left;
  margin-right:0.2em;
  }
#djdot_c a {
  display:block;
  width:7em;
  height:2em;
  position:relative;
  text-decoration:none;
  }
#djdot_c a em {
  font-style:normal;
  color:#000;
  display:block;
  width:7em;
  height:1.5em;
  border-bottom:0.5em solid #000;
  position:absolute;
  top:0;
  left:0;
  cursor:pointer;
  }
#djdot_c a:hover {
  color:#c00;
  }
#djdot_c a:hover em {
  border-bottom:0.5em solid #c00;
  }

#djdot_c a:active, #djdot_c a:focus {
  /* reduce the link size to zero when the link is in the
  active/focus state.
  This literally removes the dotted border which is ONLY applied
  to the link itself and not any containing elements WHEN THOSE
  ELEMENTS HAVE A POSITION ABSOLUTE! */
  width:0; height:0;
  outline:0; /* for browsers that understand */
  }
/* adding the active/focus state */
#djdot_d {
  list-style-type:none;
  padding:0;
  width:36em;
  height:5em;
  margin:0 auto;
  }
#djdot_d li {
  display:block;
  width:7em;
  height:2em;
  float:left;
  margin-right:0.2em;
  }
#djdot_d a {
  display:block;
  width:7em;
  height:2em;
  position:relative;
  text-decoration:none;
  }
#djdot_d a em {
  display:block;
  font-style:normal;
  width:7em;
  height:1.5em;
  color:#000;
  border-bottom:0.5em solid #000;
  position:absolute;
  top:0;
  left:0;
  cursor:pointer;
  }
#djdot_d a:hover {
  color:#c00;
  }
#djdot_d a:hover em {
  border-bottom:0.5em solid #c00;
  }
#djdot_d a:active, #djdot_d a:focus {
  width:0;
  height:0;
  outline:0; /* for browsers that understand */
  }
#djdot_d a:active em, #djdot_d a:focus em {
  /* change the em bottom border and text to blue on
  active/focus thus giving a suitable alternative to
  the dotted border */
  border-bottom:0.5em solid #00c;
  color:#00c;
  outline:0; /* for browsers that understand */
  }
 
@media print {
.tabcontent {
display:block !important;
}
}
Try adding margin-right:auto; margin-left:auto to the style I showed you.

Verionia 01-10-2010 06:48 PM
Anything for 4.0 ?

Digital Jedi 01-10-2010 09:05 PM
Quote:
Originally Posted by Verionia (Post 1952198)
Anything for 4.0 ?
If there was, I would release it in the 4.0 section. I don't have 4.0, so I don't know what phrases have changed. Until then, I have no idea what tweaks would need to be made.

Thelonius Beck 01-31-2010 12:50 AM
Excellent!

It's just what I needed for my new style. I'm even (for once) using the stock images, as they fit perfectly with the skin.

Thanks.

Thelonius Beck 02-14-2010 02:03 PM
Ahh OK. I found an issue.

For some reason, in Internet Explorer I get the dots, but they don't work. They don't even act like a link when I hover over them. All fine in FF, Opera, Safari & Chrome.

Anybody else have this issue?

***Edit: I found it. There is a conflict with the image reflection Javascript I'm using when browsing with IE. Will post work around if/when I find one. For now I'm just conditioning out the reflection for IE users.

Dakotadr 02-24-2010 07:43 PM
Hello I have a quick question hopefully. I uploaded the mod and did everything that I was suppose to the problem i'm having id how do you block off the sections like in the screen shots. I want the diffrent sections to be in a box of their own......


All times are GMT. The time now is 06:51 PM.
Page 36 of 39 « First 263435 36 3738 Last »
Show 40 post(s) from this thread on one page

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01397 seconds
  • Memory Usage 1,767KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (4)bbcode_code_printable
  • (4)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (4)pagenav_pagelink
  • (1)pagenav_pagelinkrel
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 
Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 
Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • pagenav_page
  • pagenav_complete
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete