STUCK ON THIS FOR OVER A WEEK! PLEASE HELP ME

ksbyers · Mar 25, 2023

Ok so i am new to all of this and i have been having a really hard time figuring this out. I need to be able to have a top nav bar which i am actually using as a table of contents and then i need a side nav bar which is being used to open up different sections that the user will need to access/see this is not for a website this is actually for a call center script. Please any advise will be very helpful please just take it easy on me the last forum i tried to join was not very nice...
below is the css i will post the html after as it is too long to add

<!DOCTYPE html>
<html>

<!USE THIS TO SET THE STYLE>

<!THIS IS THE START OF CSS DO NOT EDIT>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
div.scrollmenu {
background-color: #999999;
overflow: auto;
white-space: nowrap;
}

div.scrollmenu a {
display: inline-block;
color: blue;
text-align: center;
padding: 14px;
text-decoration: none;
}

div.scrollmenu a:hover {
background-color: #777777;
}
* {box-sizing: border-box}

body {font-family: "Lato", sans-serif;}

/* Style the tab */

.tab {

float: left;

border: 2px solid #fff;

background-color: #fff;

width: 18%;

height: 200px;
position: fixed;
}
/* Style the buttons inside the tab */
.tab button {
display: block;
background-color: inherit;
color: black;
padding: 25px;
width: 100%;
border: none;
outline: none;
text-align: left;
cursor: pointer;
transition: 0.03s;
font-size: 20px;
}

/* Change background color of buttons on hover */
.tab button:hover {
background-color: #fff;
}

/* Create an active/current "tab button" class */
.tab button.active {
background-color: #acdd;
}

/* Style the tab content */
.tabcontent {
float: right;
padding: 0px 200px;
border: 1px solid #fff;
width: 80%;
border-left: none;
height: auto;

}
p.MsoNormal, li.MsoNormal, div.MsoNormal
{mso-style-unhide:no;
mso-style-qformat:yes;
mso-style-parent:"";
margin-top:0in;
margin-right:0in;
margin-bottom:8.0pt;
margin-left:0in;
line-height:105%;
mso-pagination:widow-orphan;
font-size:11.0pt;
font-family:"Calibri",sans-serif;
mso-ascii-font-family:Calibri;
mso-ascii-theme-font:minor-latin;
mso-fareast-font-family:Calibri;
mso-fareast-theme-font:minor-latin;
mso-hansi-font-family:Calibri;
mso-hansi-theme-font:minor-latin;
mso-bidi-font-family:"Calibri";
mso-bidi-theme-font:minor-bidi;}
/*THIS SETS THE STYLE FOR ANY SECTIONS SHOWN WITH HEADINGS OF DETAILS*/

details {
padding: 20px;
background-color: #fff;
margin-bottom: 20px;
font-family: Calibri;
font-size: 24px
/*THIS SETS THE STYLE FOR ANY SUB SECTION 1'S HEADINGS*/
}
#sub1 {
font-family: "Calibri", sans-serif;
font-size: 23px;
color: blue;
font-weight: bold;
}
/*THIS SETS THE STYLE FOR ANY AGENT REMINDER SECTIONS*/

#agent {
color: red;
font-family: "Calibri", sans-serif;
font-size: 22px;
font-style: italic;
font-weight: bold;
text-align: left;

}

/*THIS SETS THE STYLE FOR ANY PLACEHOLDERS THAT FIVE9 READS*/

#placeholders {
color: red;
font-family: "Calibri", sans-serif;
font-size: 22px;
font-style: italic;
}
/*THIS SETS THE STYLE FOR ALL CLOSED HEADINGS*/

details > summary {
padding: 10px 5px;
background-color: #fff;
border: none;
box-shadow: 4px 3px 4px white;
cursor: pointer;
font-family: Calibri;
font-size: 20px;
text-align: left
}
/*THIS SETS THE STYLE FOR ALL AGENT TO READ TO CUST SECTIONS*/

details > p {
border-radius: 0 0 10px 10px;
background-color: #fff;
padding: 5px 10px;
margin: 0;
font-family: Calibri;
font-size: 22px
}
/*THIS SETS THE STYLE FOR ALL OPEN HEADINGS*/

details[open] > summary {
background-color: #ccf;
border-bottom: 1px solid #aaa;
margin-bottom: 0em;
font-family:Calibri;
font-size: 24px;
text-align: left
}
/*THIS SETS THE ARROW TO BE LINED UP WITH THE TEXT*/

details summary > * {
display: inline;
}
/*THIS SETS THE STYLE FOR ALL OPEN HEADINGS SHOWN AS DETAILS*/

details[open] {
padding: 5px;
background-color: #fff;
margin-bottom: 20px;
font-family: Calibri;
font-size: 24px;
text-align: left
}
/*THIS SETS THE STYLE FOR THE SCRIPT HEADING WITH PROGRAM NAME PH NUMBER ETC*/

body {
padding: 20px;
background-color: #fff;
margin-bottom: 20px;
font-family: Calibri;
font-size: 24px;
text-align: center;
}
hr {
position: relative;
border: none;
height: 5px;
background: black;
margin-bottom: 5px;
}
/*THIS IS THE END OF CSS DO NOT EDIT*/
</style>

ksbyers · Mar 25, 2023

I WILL HAVE TO MAKE ANOTHER COUPLE OF POSTINGS AS MY CODE IS VERY LONG

<body>

<div class="tab">
<button class="tablinks" onclick="openCCNX(event, 'Script')" id="defaultOpen">Script</button>
<button class="tablinks" onclick="openCCNX(event, 'Spanish Script')">Spanish Script</button>
<button class="tablinks" onclick="openCCNX(event, 'Report Same Day Reschedule')">Report Same Day Reschedule</button>
<button class="tablinks" onclick="openCCNX(event, 'PDS ONLY Create New Zendesk Ticket')">PDS ONLY BELOW</button>
<button class="tablinks" onclick="openCCNX(event, 'PDS ONLY Create New Zendesk Ticket')">PDS ONLY Create New Zendesk Ticket</button>
<button class="tablinks" onclick="openCCNX(event, 'PDS ONLY DispatchTracker')">PDS ONLY DispatchTracker</button>

</div>
<div id="Script" class="tabcontent">
<h3></h3>
<p>

<div align=center>
<h2>Table of Contents</h2>
<p>Click on the section you wish to go to below:</p>

<div class="scrollmenu">
<a href="#Heading">Heading</a>
<a href="#GENERAL_GREETING">General Greeting</a>
<a href="#EXISTING_OR_NEW">Existing Or New</a>
<a href="#PICKUP_NEW_ORDER">Pickup Options For A New Order</a>
<a href="#OWNER_NEW_ORDER">New Orders: Are You The Owner Of The Appliance?</a>
<a href="#LANDLORD_FORM_NEW_ORDER">New Orders (if landlord form is needed)</a>
<a href="#LANDLORD_FORM_EXISTING">Existing Orders (if landlord form is needed)</a>
<a href="#CUSTOMER_DEMOGRAPHICS">Customer Demographics (Spell And Read back)</a>
<a href="#ADDITIONAL_INFO">Additional Info Tab</a>
<a href="#STAIRS_NEW_ORDER">New Orders: STAIRS</a>
<a href="#UNIT_INFO">Collect Unit Information</a>
<a href="#SURVEY_QUESTIONS">Ask Survey Questions in Survey Tab</a>
<a href="#INCENTIVE">Review Incentive Type, Amount, Mailing Address, And Timeframe</a>
<a href="#IN_HOME_REMINDERS">In Home Pick-up Reminders</a>
<a href="#OUTSIDE_REMINDERS">Outside No Contact Pick-up Reminder</a>
<a href="#CLOSING">Closing Statement</a>
<a href="#COMPLAINT">Complaint or Escalation Process</a>
<a href="#SCRIPT_HISTORY">Work</a>
<a href="#work">Script History And Updates</a>
</center>

</div>

cittybb24356 · May 5, 2024

Download an html editor to do all your html coding. Then you can view it. It's free too. And you want to pay for the files you created too? To see how it looks in a real browser situation. That's done with the help of a server. Server side applications. We are clients. But turn it around, and we become server side. You need a server and a html text editor for all your modified web pages.

cittybb24356 · May 7, 2024

Use cut and paste method to get your script into the temporary storage paper clip area. Press copy or cut. Then go to this page or forum, and paste it on there. It shows up as is...

cittybb24356 · May 7, 2024

ksbyers said:
I WILL HAVE TO MAKE ANOTHER COUPLE OF POSTINGS AS MY CODE IS VERY LONG

<body>

<div class="tab">
<button class="tablinks" onclick="openCCNX(event, 'Script')" id="defaultOpen">Script</button>
<button class="tablinks" onclick="openCCNX(event, 'Spanish Script')">Spanish Script</button>
<button class="tablinks" onclick="openCCNX(event, 'Report Same Day Reschedule')">Report Same Day Reschedule</button>
<button class="tablinks" onclick="openCCNX(event, 'PDS ONLY Create New Zendesk Ticket')">PDS ONLY BELOW</button>
<button class="tablinks" onclick="openCCNX(event, 'PDS ONLY Create New Zendesk Ticket')">PDS ONLY Create New Zendesk Ticket</button>
<button class="tablinks" onclick="openCCNX(event, 'PDS ONLY DispatchTracker')">PDS ONLY DispatchTracker</button>

</div>
<div id="Script" class="tabcontent">
<h3></h3>
<p>

<div align=center>
<h2>Table of Contents</h2>
<p>Click on the section you wish to go to below:</p>

<div class="scrollmenu">
<a href="#Heading">Heading</a>
<a href="#GENERAL_GREETING">General Greeting</a>
<a href="#EXISTING_OR_NEW">Existing Or New</a>
<a href="#PICKUP_NEW_ORDER">Pickup Options For A New Order</a>
<a href="#OWNER_NEW_ORDER">New Orders: Are You The Owner Of The Appliance?</a>
<a href="#LANDLORD_FORM_NEW_ORDER">New Orders (if landlord form is needed)</a>
<a href="#LANDLORD_FORM_EXISTING">Existing Orders (if landlord form is needed)</a>
<a href="#CUSTOMER_DEMOGRAPHICS">Customer Demographics (Spell And Read back)</a>
<a href="#ADDITIONAL_INFO">Additional Info Tab</a>
<a href="#STAIRS_NEW_ORDER">New Orders: STAIRS</a>
<a href="#UNIT_INFO">Collect Unit Information</a>
<a href="#SURVEY_QUESTIONS">Ask Survey Questions in Survey Tab</a>
<a href="#INCENTIVE">Review Incentive Type, Amount, Mailing Address, And Timeframe</a>
<a href="#IN_HOME_REMINDERS">In Home Pick-up Reminders</a>
<a href="#OUTSIDE_REMINDERS">Outside No Contact Pick-up Reminder</a>
<a href="#CLOSING">Closing Statement</a>
<a href="#COMPLAINT">Complaint or Escalation Process</a>
<a href="#SCRIPT_HISTORY">Work</a>
<a href="#work">Script History And Updates</a>
</center>

</div>

Is this script or program trying to pop up some information? I'm trying to figure out what's wrong. Or what else is to be done. You won't be able to link those buttons to some other page. They use C# or C++ or Java programs to do that. Here is what it looks in a class filed compiled and used in a html web page. You would add this in the web page. And few other codes just to get the correct position pointing to the buttons and pressed. Using mouseMotionListener() method in java programming.

You would add the class file in Java in the header area and where it says script. The Name of the class there. #Name(). The browser searches the value of a name in a file. It's in another class in the server. When button is pressed, the web page or information of the page shows up. Nice buttons!

Code:

button.addActionListener(new ActionListener() {
    public void actionPerformed(ActionEvent e) {
        open("www.google.com"); // just what is the 'open' method?
    }
});

Search

Search

STUCK ON THIS FOR OVER A WEEK! PLEASE HELP ME

ksbyers

New member

ksbyers

New member

cittybb24356

Member

cittybb24356

Member

cittybb24356

Member

Similar threads