PDA

View Full Version : New Thread/Reply Issues

SVTCobraLTD
03-21-2011, 12:46 AM
All of the buttons at the top of the New Thread/Reply screens are supposed to have a light gray background like a few of them do. But when the page is loaded, they never do unless I move the mouse over the image, then they all show up like the few that have a background in the image. What is happening?

3.8.7
BirdOPrey5
03-23-2011, 01:57 AM
Looks like you might have some transparent gifs for some images and non-transparent for others (the grey ones.) Is it always the same images with the problem? Does it happen in multiple browsers? If so that's probably the issue...

You could probably just copy the original images from the vbulletin install files to fix it.
SVTCobraLTD
03-23-2011, 10:56 AM
They are all transparent backgrounds until I roll the mouse over them. Then they all turn into the ones with the gray backgrounds.
BirdOPrey5
03-23-2011, 11:23 AM
Sounds like it is probably a bug with your web browser then.
SVTCobraLTD
03-23-2011, 04:22 PM
Happens in IE and Firefox. It even was happening on my 3.6 board and still is when upgraded to 3.8.
BirdOPrey5
03-23-2011, 04:33 PM
Very weird... It's possible the "onmouseover" event is loading a different version of the image (non-transparent) but you'd need to have both versions of the image in your image directory somewhere, so I'd assume you'd notice that.
SVTCobraLTD
03-23-2011, 05:44 PM
Only 1 version of the file is online. However, its a transparent gif. Maybe I just need to add the BG color to it and be done with it.

Actually just tried making the BG color the color it should be but still same issue. It showed up with no BG color until i went over it with the mouse.
BirdOPrey5
03-23-2011, 08:13 PM
Only 1 version of the file is online. However, its a transparent gif. Maybe I just need to add the BG color to it and be done with it.

Actually just tried making the BG color the color it should be but still same issue. It showed up with no BG color until i went over it with the mouse.

I would remove the transparency... also once you do you'll have to refresh your browser's cache, usually holding down CTRL or SHIFT when hitting refresh...

If that doesn't do it I'm out of ideas... hopefully someone else can chime in.
SVTCobraLTD
03-23-2011, 08:58 PM
I think the issue is the gray box is missing around the outside of the reply screen. See that attached screen shot which is the quick reply box. That already has the frame around the outside of the box which causes the images to show correctly. ??
BirdOPrey5
03-23-2011, 11:37 PM
Could be... what controls that is Style Manager -> your style -> All Style Options -> Editor buttons in normal state... make it light grey or any color you want.
SVTCobraLTD
03-24-2011, 10:34 AM
I already looked into that. It is gray like it should be. Just not sure what controls that box being added?
BirdOPrey5
03-24-2011, 12:16 PM
OK, I joined your forum to see the editor code...

The issue is with the CSS for vBulletin_editor which controls the color around your editor. When I removed this from my own editor code, the grey disappeared and just like yours.

In my source code (www.juot.net/forums/) if you want to compare, I have this code on my HTML source page:

<!-- Editor Styles -->

<style type="text/css" id="vbulletin_editor_css_dynamic">

<!--

@import url("clientscript/vbulletin_editor.css?v=386");



.vBulletin_editor {

background: #E1E1E2;

padding: 6px;

}

.imagebutton {

background: #E1E1E2;

color: #000000;

padding: 1px;

border: none;

}

.ocolor, .ofont, .osize, .osmilie, .osyscoloar, .smilietitle {

background: #FFFFFF;

color: #000000;

border: 1px solid #FFFFFF;

}

.popup_pickbutton {

border: 1px solid #FFFFFF;

}

.popup_feedback {

background: #FFFFFF;

color: #000000;

border-right: 1px solid #FFFFFF;

}

.popupwindow {

background: #FFFFFF;

}

#fontOut, #sizeOut, .popup_feedback div {

background: #FFFFFF;

color: #000000;

}

.alt_pickbutton {

border-left: 1px solid #E1E1E2;

}

.popup_feedback input, .popup_feedback div

{

border: 0px solid;

padding: 0px 2px 0px 2px;

cursor: default;

font: 11px tahoma;

overflow: hidden;

}

-->

</style>

<!-- / Editor Styles -->


But you are missing all of that.
SVTCobraLTD
03-24-2011, 12:36 PM
Thank you very much for taking the time to look at this.

Where does this coding get entered though? I cannot find any file or style called Vbulletin_editor?
BirdOPrey5
03-24-2011, 12:40 PM
There's a template editor_css

This is a copy and paste from my editor_css template:


<!-- Editor Styles -->
<style type="text/css" id="vbulletin_editor_css_dynamic">
<!--
@import url("clientscript/vbulletin_editor.css?v=$vboptions[simpleversion]");

.vBulletin_editor {
background: {$istyles[pi_button_normal][0]};
padding: $stylevar[cellpadding]px;
}
.imagebutton {
background: {$istyles[pi_button_normal][0]};
color: {$istyles[pi_button_normal][1]};
padding: {$istyles[pi_button_normal][2]};
border: {$istyles[pi_button_normal][3]};
}
.ocolor, .ofont, .osize, .osmilie, .osyscoloar, .smilietitle {
background: {$istyles[pi_menu_normal][0]};
color: {$istyles[pi_menu_normal][1]};
border: {$istyles[pi_menu_normal][3]};
}
.popup_pickbutton {
border: {$istyles[pi_menu_normal][3]};
}
.popup_feedback {
background: {$istyles[pi_menu_normal][0]};
color: {$istyles[pi_menu_normal][1]};
border-$stylevar[right]: {$istyles[pi_menu_normal][3]};
}
.popupwindow {
background: {$istyles[pi_menu_normal][0]};
}
#fontOut, #sizeOut, .popup_feedback div {
background: {$istyles[pi_menu_normal][0]};
color: {$istyles[pi_menu_normal][1]};
}
.alt_pickbutton {
border-$stylevar[left]: 1px solid {$istyles[pi_button_normal][0]};
}
.popup_feedback input, .popup_feedback div
{
border: 0px solid;
padding: 0px 2px 0px 2px;
cursor: default;
font: 11px tahoma;
overflow: hidden;
}
-->
</style>
<!-- / Editor Styles -->


It should help, but my colors may be different.

Save your editor_css to a text file first in case you need to go back.
SVTCobraLTD
03-24-2011, 02:42 PM
Still nothing. Refreshed browser with clearing cache and still no go.
BirdOPrey5
03-24-2011, 03:10 PM
Check the source code and see if that editor_css code is in it. If it's not your style isn't calling the editor_css template at all. Probably points to a problem in SHOWTHREAD template, but lets not get ahead of ourselves.
SVTCobraLTD
03-24-2011, 03:34 PM
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td id="vB_Editor_001" class="vBulletin_editor" width="100%">
<div id="vB_Editor_001_controls" class="controlbar">

<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td><div class="imagebutton" id="vB_Editor_001_cmd_removeformat"><img src="images/styles/visualdepth/editor/removeformat.gif" width="21" height="20" alt="Remove Text Formatting" /></div></td>

<td><img src="images/styles/visualdepth/editor/separator.gif" width="6" height="20" alt="" /></td>


<td><div class="imagebutton" id="vB_Editor_001_popup_fontname" title="Fonts">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="popup_feedback"><div id="vB_Editor_001_font_out" style="width:91px">&nbsp;</div></td>
<td class="popup_pickbutton"><img src="images/styles/visualdepth/editor/menupop.gif" width="11" height="16" alt="" /></td>

</tr>
</table>
</div></td>


<td><div class="imagebutton" id="vB_Editor_001_popup_fontsize" title="Sizes">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="popup_feedback"><div id="vB_Editor_001_size_out" style="width:25px">&nbsp;</div></td>
<td class="popup_pickbutton"><img src="images/styles/visualdepth/editor/menupop.gif" width="11" height="16" alt="" /></td>
</tr>

</table>
</div></td>


<td><img src="images/styles/visualdepth/editor/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="vB_Editor_001_popup_forecolor" title="Colors">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td id="vB_Editor_001_color_out"><img src="images/styles/visualdepth/editor/color.gif" width="21" height="16" alt="" /><br /><img src="clear.gif" id="vB_Editor_001_color_bar" alt="" style="background-color:black" width="21" height="4" /></td>
<td class="alt_pickbutton"><img src="images/styles/visualdepth/editor/menupop.gif" width="11" height="16" alt="" /></td>
</tr>

</table>
</div></td>


<td><img src="images/styles/visualdepth/editor/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="vB_Editor_001_popup_smilie" title="Smilies">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td><img src="images/styles/visualdepth/editor/smilie.gif" alt="" width="21" height="20" /></td>
<td class="alt_pickbutton"><img src="images/styles/visualdepth/editor/menupop.gif" width="11" height="16" alt="" /></td>
</tr>

</table>
</div></td>


<td><div class="imagebutton" id="vB_Editor_001_popup_attach" title="Attachments">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td><img src="images/styles/visualdepth/editor/attach.gif" alt="" width="21" height="20" /></td>
<td class="alt_pickbutton"><img src="images/styles/visualdepth/editor/menupop.gif" width="11" height="16" alt="" /></td>
</tr>
</table>

</div></td>


<!--
<td><img src="images/styles/visualdepth/editor/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_cut"><img src="images/styles/visualdepth/editor/cut.gif" width="21" height="20" alt="Cut" /></div></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_copy"><img src="images/styles/visualdepth/editor/copy.gif" width="21" height="20" alt="Copy" /></div></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_paste"><img src="images/styles/visualdepth/editor/paste.gif" width="21" height="20" alt="Paste" /></div></td>
-->

<td><img src="images/styles/visualdepth/editor/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_undo"><img src="images/styles/visualdepth/editor/undo.gif" width="21" height="20" alt="Undo" /></div></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_redo"><img src="images/styles/visualdepth/editor/redo.gif" width="21" height="20" alt="Redo" /></div></td>

<td width="100%">&nbsp;</td>

<td>
<div class="imagebutton" id="vB_Editor_001_cmd_resize_0_100"><img src="images/styles/visualdepth/editor/resize_0.gif" width="21" height="9" alt="Decrease Size" /></div>

<div class="imagebutton" id="vB_Editor_001_cmd_resize_1_100"><img src="images/styles/visualdepth/editor/resize_1.gif" width="21" height="9" alt="Increase Size" /></div>
</td>

<td><div class="imagebutton" id="vB_Editor_001_cmd_switchmode"><img src="images/styles/visualdepth/editor/switchmode.gif" width="21" height="20" alt="Switch Editor Mode" /></div></td>

</tr>
</table>


<table cellpadding="0" cellspacing="0" border="0">
<tr>

<td><div class="imagebutton" id="vB_Editor_001_cmd_bold"><img src="images/styles/visualdepth/editor/bold.gif" width="21" height="20" alt="Bold" /></div></td>

<td><div class="imagebutton" id="vB_Editor_001_cmd_italic"><img src="images/styles/visualdepth/editor/italic.gif" width="21" height="20" alt="Italic" /></div></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_underline"><img src="images/styles/visualdepth/editor/underline.gif" width="21" height="20" alt="Underline" /></div></td>


<td><img src="images/styles/visualdepth/editor/separator.gif" width="6" height="20" alt="" /></td>

<td><div class="imagebutton" id="vB_Editor_001_cmd_justifyleft"><img src="images/styles/visualdepth/editor/justifyleft.gif" width="21" height="20" alt="Align Left" /></div></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_justifycenter"><img src="images/styles/visualdepth/editor/justifycenter.gif" width="21" height="20" alt="Align Center" /></div></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_justifyright"><img src="images/styles/visualdepth/editor/justifyright.gif" width="21" height="20" alt="Align Right" /></div></td>



<td><img src="images/styles/visualdepth/editor/separator.gif" width="6" height="20" alt="" /></td>


<td><div class="imagebutton" id="vB_Editor_001_cmd_insertorderedlist"><img src="images/styles/visualdepth/editor/insertorderedlist.gif" width="21" height="20" alt="Ordered List" /></div></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_insertunorderedlist"><img src="images/styles/visualdepth/editor/insertunorderedlist.gif" width="21" height="20" alt="Unordered List" /></div></td>




<td><div class="imagebutton" id="vB_Editor_001_cmd_outdent"><img src="images/styles/visualdepth/editor/outdent.gif" width="21" height="20" alt="Decrease Indent" /></div></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_indent"><img src="images/styles/visualdepth/editor/indent.gif" width="21" height="20" alt="Increase Indent" /></div></td>



<td><img src="images/styles/visualdepth/editor/separator.gif" width="6" height="20" alt="" /></td>

<td><div class="imagebutton" id="vB_Editor_001_cmd_createlink"><img src="images/styles/visualdepth/editor/createlink.gif" width="21" height="20" alt="Insert Link" /></div></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_unlink"><img src="images/styles/visualdepth/editor/unlink.gif" width="21" height="20" alt="Remove Link" /></div></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_email"><img src="images/styles/visualdepth/editor/email.gif" width="21" height="20" alt="Insert Email Link" /></div></td>


<td><div class="imagebutton" id="vB_Editor_001_cmd_insertimage"><img src="images/styles/visualdepth/editor/insertimage.gif" width="21" height="20" alt="Insert Image" /></div></td>



<td><img src="images/styles/visualdepth/editor/separator.gif" width="6" height="20" alt="" /></td>
<td><div class="imagebutton" id="vB_Editor_001_cmd_wrap0_quote"><img src="images/styles/visualdepth/editor/quote.gif" width="21" height="20" alt="Wrap QUOTE tags around selected text" /></div></td>



<td><img src="images/styles/visualdepth/editor/separator.gif" width="6" height="20" alt="" /></td>

<td><div class="imagebutton" id="vB_Editor_001_cmd_wrap0_code"><img src="images/styles/visualdepth/editor/code.gif" width="21" height="20" alt="Wrap CODE tags around selected text" /></div></td>


<td><div class="imagebutton" id="vB_Editor_001_cmd_wrap0_html"><img src="images/styles/visualdepth/editor/html.gif" width="21" height="20" alt="Wrap HTML tags around selected text" /></div></td>


<td><div class="imagebutton" id="vB_Editor_001_cmd_wrap0_php"><img src="images/styles/visualdepth/editor/php.gif" width="21" height="20" alt="Wrap PHP tags around selected text" /></div></td>



</tr>
</table>


Not sure if this is any help. Did a search for "editor_css" and nothing came up.
BirdOPrey5
03-24-2011, 04:14 PM
OK lets try this... in your headinclude template...

Directly above the line:


<!-- / CSS Stylesheet -->


Do you have:

<if condition="$show['editor_css']">
$editor_css
</if>


If not, add that code to your headinclude template.
SVTCobraLTD
03-24-2011, 04:55 PM
That was it!! Thank you very much for all your efforts and assistance. You were a huge help.
BirdOPrey5
03-24-2011, 05:48 PM
:up: great.