I have 2 problems. In my webpage, I have a dropdown list with a button that takes the user to a popup window specific to the option. I am using Firefox 2.0.0.13. I have successfully validated my HTML and CSS code.
1. When I clear cache and refresh my webpage, it takes 3 tries before the popup window displays - I click on the button once, a white window the size of my webpage displays. I close it and click on the button again (for the same option) and a white window the size of my webpage displays again. Close that window and click the button again (for the same option) and a white window initially displays, then goes away and the normal sized popup window displays correctly. I can then close the popup and choose any other option and get the popup with the first try. Once I clear cache though, it starts over again.
2. Once the popup window is displaying, it initially displays as a white page the same size as the webpage, then when it connects to the URL the white page goes away and the normal sized popup window displays.
I'm looking for 1. the popup window to display the first time I click on the submit button whether I've cleared cache or not, and 2. the initial, extra white page to not display.
Thank you for any help you might offer.
HTML
Expand|Select|Wrap|Line Numbers
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
- "http://www.w3.org/TR/html4/strict.dtd">
- <html>
- <head>
- <title>Company</title>
- <meta http-equiv="Content-Type"
- content="text/html; charset=utf-8">
- <link href="style.css" rel="stylesheet" type="text/css" >
- <link rel='SHORTCUT ICON'
- href='../images/favicon.ico'>
- <script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script>
- <script type="text/javascript">
- _uacct = "UA-12134";
- urchinTracker();
- </script>
- </head>
- <body id="support">
- <div id="bodyWrapper"> <!-- center page on viewport -->
- <div id="navright_container">
- <script type="text/javascript" src="topmenu.js"></script>
- </div><!-- navright_container -->
- <div style="clear:both;"></div>
- <div id="topBorder">
- <img style="float:left;width:99%;" src="images/heading915x135.png" alt="Banner">
- <div style="clear:both;"></div>
- <div id="navbar_container">
- <div id="navbar">
- <script type="text/javascript" src="menu.js"></script><!-- menu -->
- </div>
- </div>
- <div style="clear:both;"></div>
- </div><!-- topborder -->
- <div class="leftpanel" style="height:26em;border:0;">
- </div>
- <div class="middleContainer">
- <div class="center">
- <h2 class="no_marg_pad" style="margin-bottom: 1em;">Support</h2>
- </div><!-- center -->
- We offer live support Monday through Friday, 7:00am - 5:00pm
- <div style="margin-top:2em;float:left;">
- Choose the type of support needed:
- <script type="text/javascript">
- function supportWindow(URL)
- {
- window.open(URL+"&refURL="+escape(document.location),'popupwindow','scrollbars,resizable');
- return false;
- }
- </script>
- <p>
- <select id="sel" size="1">
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=18427&UID=0&SK=9numbercodese">Support1</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=18442&UID=0&SK=fnumbercodes3">Support2</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=18407&UID=0&SK=5numbercodes1">Support3</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=18452&UID=0&SK=6numbercodese">Support4</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=18457&UID=0&SK=6numbercodes9">Support5</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=18447&UID=0&SK=fnumbercodes4">Support6</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=18417&UID=0&SK=6numbercodes0">Support7</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=18437&UID=0&SK=9numbercodes5">Support8</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=18422&UID=0&SK=enumbercodesc">Support9</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=18432&UID=0&SK=5numbercodes1">Support10</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=19612&UID=0&SK=dnumbercodes3">Support11</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=19607&UID=0&SK=5numbercodesf">Support12</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=19617&UID=0&SK=7numbercodes7">Support13</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=19907&UID=0&SK=bnumbercodes6">Support14</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=19912&UID=0&SK=enumbercodesf">Support15</option>
- <option value="https://company.webex.com/u2logic/webacd.wbx?AT=pqform&QID=20212&UID=0&SK=9numbercodesc">Support16</option>
- </select>
- <input type="button" value="Submit" onclick="supportWindow(document.getElementById('sel').value)">
- </p>
- </div>
- </div><!-- middle container -->
- <div style="clear:both;"></div>
- <script type="text/javascript" src="footer.js"></script><!-- footer address -->
- </div><!-- bodyWrapper -->
- </body>
- </html>
Expand|Select|Wrap|Line Numbers
- html {
- /* commented backslash hack \*/
- height:100%;
- /* end hack */
- margin:0;
- padding:0;
- }
- body {
- /* commented backslash hack \*/
- height:100%;
- /* end hack */
- min-height:100%;
- text-align:center;
- min-width:80%;
- margin:0;
- padding:0;
- background:#406580;
- background:#115681;
- }
- body#downloads a#downloads_link,
- body#index a#index_link,
- body#services a#services_link,
- body#cases a#cases_link,
- body#employment a#employment_link,
- body#about a#about_link,
- body#contact a#contact_link,
- body#support a#support_link,
- body#webdocs a#webdocs_link,
- body#webcrm a#webcrm_link {
- text-decoration:none;
- color:white;
- font-weight:bold;
- background-color: #2175B5;
- margin:0;
- padding:0 .5em 0 .5em;
- }
- #bodyWrapper {
- position:relative;
- background-color:white;
- margin-right:auto; /* center */
- margin-left:auto; /* center */
- padding:0;
- width:59.1em;
- padding-bottom:1px;
- text-align:left;
- font-family:Helvetica, Arial, Verdana, sans-serif;
- /* border:1px solid black; */
- }
- /* img.logo and .tagline height, margins, padding, font size, and maybe bold work together.
- If change one, will have to adjust others. */
- img.logo {
- width:29.6%;
- float:left;
- margin:0 0 0 4%;
- padding:1% 0 1% 0
- }
- .tagline {
- float:right;
- height:75px;
- width:60%;
- color:white;
- font-family:Helvetica, Arial, Verdana, sans-serif;
- font-weight:bold;
- font-size:1.5em;
- text-align:center;
- padding:4% 0 0 0;
- /* background-image: url(images/TagBackground630x120.png)
- */
- }
- .center {
- text-align:center;
- }
- .leftpanel {
- float:left;
- margin:.5% 0 0 .25%;
- width:20%;
- border:#C9CFD1 1px solid;
- border-top:0;
- }
- .sampleApp {
- float:left;
- width:95%;
- padding:0;
- margin:2% 0 0 2%;
- }
- .dividerBar {
- background-color:#C9CFD1;
- height:1px;
- margin-top:2%;
- margin-bottom:2%;
- padding:0;
- }
- .webEase {
- float:left;
- width:95%;
- margin:2% 0 0 2%;
- }
- .topleft {
- /* background-color:#CEDFEF;
- */
- }
- .bottomleft {
- /* background-color:#FFE3C6;
- */
- }
- .sidetext {
- margin:1% 1% 0 3%;
- font-size:.75em;
- }
- .mainContainer {
- float:left;
- width:100%;
- margin:3% 0 1% 9%;
- font-family:Helvetica, Arial, Verdana, sans-serif;
- }
- .middleContainer {
- float:left;
- width:60%;
- margin:3% 0 1% 9%;
- font-family:Helvetica, Arial, Verdana, sans-serif;
- }
- .no_marg_pad {
- margin:0;
- padding:0;
- }
- .pt75em {
- font-size:.75em;
- }
- .introText {
- float:left;
- margin:0 0 .25% 0;
- padding:0;
- font-size:.8em;
- font-family:Helvetica, Arial, Verdana, sans-serif;
- font-weight:bold;
- }
- table {
- border-collapse:collapse;
- margin:1em 0 0 5em;
- }
- td {
- /* border:1px solid silver; */
- font-size:.9em;
- }
- /* th { border:1px solid silver; } */
- /* Code to build header picture. Example to use for future page.
- <br />
- <img class="logo" src="images/logo.png" alt="logo" />
- <div class="head_frame" style="border:#339966 1em solid;"></div>
- <img style="position:relative;left:20em;top:-13em;" src="images/Company.png" alt="About Us" />
- <div style="height:180px; position:relative;top:-24.5em;left:46.8em;width:11.4em;background:#339966;filter:alpha(opacity=60);
- filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60);-moz-opacity:0.60;opacity:0.6;" />
- */
- .category_hdg {
- font-weight:bold;
- font-size:.9em;
- color:white;
- padding:3% 0 3% 0;
- text-align:center;
- border-bottom:black 2px solid;
- }
- .saas_category_hdg {
- font-weight:bold;
- font-size:.9em;
- color:white;
- padding:1% 0 1% 0;
- text-align:center;
- border-bottom:black 2px solid;
- }
- .product_txt {
- font-size:.75em;
- }
- .txt80 {
- font-size:.80em;
- margin:2% 4% 0 4%;
- }
- .product_txt ul {
- margin:2% 0 0 11%;
- padding:0;
- font-size:.955em;
- }
- .product_txt80 {
- font-size:.80em;
- }
- .product_txt80 ul{
- margin:4% 0 0 13%;
- padding:0;
- }
- .product_txt90 li{
- margin:2% 0 0 0;
- }
- .product_txt90 a {
- color:black;
- }
- #footer {
- position:relative;
- top:1px;left:0;
- width:100%;
- text-align:center;
- background:#3D93CA;
- background:#013654;
- color:white;
- font-size:10pt;
- border-top:1px solid black;
- border-bottom:1px solid black;
- margin:0 0 0 -1px;
- padding:0 2px 2px 0;
- }
- /* Right Menu */
- #navright_container {
- width:100%;
- float:right;
- background-color:#013654;
- border-top:1px solid black;
- border-bottom:1px solid black;
- color:white;
- }
- #navright {
- margin:0;
- padding:0;
- }
- #navright ul {
- float:right;
- margin:0;
- padding:0;
- }
- #navright ul li {
- display: inline;
- }
- #navright a {
- float:right;
- border-left: 1px white solid;
- text-decoration:none;
- font-weight:bold;
- font-size:.75em;
- color: white;
- padding:0 .5em 0 .5em;
- margin:0;
- }
- #navright a:hover {
- color: #234163;
- background: #BDDFF7;
- text-decoration:none;
- font-weight:bold;
- }
- /* Menu */
- #navbar_container {
- width:100%;
- float:left;
- border-top:1px solid black;
- border-bottom:1px solid black;
- background-color:#013654;
- }
- #navbar {
- margin:0;
- padding:0;
- }
- #navbar ul {
- float:left;
- }
- #navbar ul li {
- display: inline;
- }
- #navbar a {
- float:left;
- border-right: 1px white solid;
- text-decoration:none;
- font-weight:bold;
- font-size:.75em;
- color: white;
- padding:0 .5em 0 .5em;
- margin:0;
- }
- #navbar a:hover {
- color:#013654;
- background:#BDDFF7;
- text-decoration:none;
- font-weight:bold;
- }
- .leftBackground {
- float:left;
- width:100%;
- height:33px;
- margin:0;
- padding:0;
- background-repeat:no-repeat;
- }
- .leftTitles {
- float:left;
- width:100%;
- margin:.6em 0 0 0;
- text-align:center;
- font-size:.90em;
- font-weight:bold;
- }
- /* Blue Rounded Corners */
- .raised {background: transparent; width:400px;}
- .raised .ab1, .raised .ab2, .raised .ab3, .raised .ab4, .raised .ab1b, .raised .ab2b, .raised .ab3b, .raised .ab4b {display:block; overflow:hidden; font-size:1px;}
- .raised .ab1, .raised .ab2, .raised .ab3, .raised .ab1b, .raised .ab2b, .raised .ab3b {height:1px;}
- .raised .ab2 {background:#2175B5; border-left:1px solid #fff; border-right:1px solid #eee;}
- .raised .ab3 {background:#2175B5; border-left:1px solid #fff; border-right:1px solid #ddd;}
- .raised .ab4 {background:#2175B5; border-left:1px solid #fff; border-right:1px solid #aaa;}
- .raised .ab4b {background:#BDDFF7; border-left:1px solid #FFE6CC; border-right:1px solid #999;}
- .raised .ab3b {background:#BDDFF7; border-left:1px solid #FFE6CC; border-right:1px solid #999;}
- .raised .ab2b {background:#BDDFF7; border-left:1px solid #FFE6CC; border-right:1px solid #999;}
- .raised .ab1 {margin:0 5px; background:#fff;}
- .raised .ab2, .raised .ab2b {margin:0 3px; border-width:0 2px;}
- .raised .ab3, .raised .ab3b {margin:0 2px;}
- .raised .ab4, .raised .ab4b {height:2px; margin:0 1px;}
- .raised .ab1b {margin:0 5px; background:#999;}
- .raised .aboxcontent {display:block; background:#BDDFF7; border-left:1px solid #fff; border-right:1px solid #999;}
- /* End Blue Rounded Corners */
- /* Green Rounded Corners */
- .raised {background: transparent; width:400px;}
- .raised .cb1, .raised .cb2, .raised .cb3, .raised .cb4, .raised .cb1b, .raised .cb2b, .raised .cb3b, .raised .cb4b {display:block; overflow:hidden; font-size:1px;}
- .raised .cb1, .raised .cb2, .raised .cb3, .raised .cb1b, .raised .cb2b, .raised .cb3b {height:1px;}
- .raised .cb2 {background:#18BA63; border-left:1px solid #fff; border-right:1px solid #eee;}
- .raised .cb3 {background:#18BA63; border-left:1px solid #fff; border-right:1px solid #ddd;}
- .raised .cb4 {background:#18BA63; border-left:1px solid #fff; border-right:1px solid #aaa;}
- .raised .cb4b {background:#BDF7D6; border-left:1px solid #FFE6CC; border-right:1px solid #999;}
- .raised .cb3b {background:#BDF7D6; border-left:1px solid #FFE6CC; border-right:1px solid #999;}
- .raised .cb2b {background:#BDF7D6; border-left:1px solid #FFE6CC; border-right:1px solid #999;}
- .raised .cb1 {margin:0 5px; background:#fff;}
- .raised .cb2, .raised .cb2b {margin:0 3px; border-width:0 2px;}
- .raised .cb3, .raised .cb3b {margin:0 2px;}
- .raised .cb4, .raised .cb4b {height:2px; margin:0 1px;}
- .raised .cb1b {margin:0 5px; background:#999;}
- .raised .cboxcontent {display:block; background:#BDF7D6; border-left:1px solid #fff; border-right:1px solid #999;}
- /* End Green Rounded Corners */
- /* Orange Rounded Corners */
- .raised {background: transparent; width:400px;}
- .raised .b1, .raised .b2, .raised .b3, .raised .b4, .raised .b1b, .raised .b2b, .raised .b3b, .raised .b4b {display:block; overflow:hidden; font-size:1px;}
- .raised .b1, .raised .b2, .raised .b3, .raised .b1b, .raised .b2b, .raised .b3b {height:1px;}
- .raised .b2 {background:#DE7129; border-left:1px solid #fff; border-right:1px solid #eee;}
- .raised .b3 {background:#DE7129; border-left:1px solid #fff; border-right:1px solid #ddd;}
- .raised .b4 {background:#DE7129; border-left:1px solid #fff; border-right:1px solid #aaa;}
- .raised .b4b {background:#FFD7C6; border-left:1px solid #FFE6CC; border-right:1px solid #999;}
- .raised .b3b {background:#FFD7C6; border-left:1px solid #FFE6CC; border-right:1px solid #999;}
- .raised .b2b {background:#FFD7C6; border-left:1px solid #FFE6CC; border-right:1px solid #999;}
- .raised .b1 {margin:0 5px; background:#fff;}
- .raised .b2, .raised .b2b {margin:0 3px; border-width:0 2px;}
- .raised .b3, .raised .b3b {margin:0 2px;}
- .raised .b4, .raised .b4b {height:2px; margin:0 1px;}
- .raised .b1b {margin:0 5px; background:#999;}
- .raised .boxcontent {display:block;background:#FFD7C6; border-left:1px solid #fff; border-right:1px solid #999;}
- /* End Orange Rounded Corners */