Stevens's blog: "How To's"

created on 12/20/2008 | http://fubar.com/how-to-s/b266817 | 51 followers

posted on 09/29/2011 @ 09:09 pm

(How To) Lounge Functions²
http://fubar.com/how-to-lounge-functions-sup2/b266817-1160785

(How To) Lounge Functions²

Many members want to know what functions they have when they first create a lounge. Some know of these functions while others are completely confused and need help understanding what functions are currently present or what they can do with each function. Below is Part 2 of 3 of my (How To) Code Lounges segment I am currently creating.

This blog will give "Members", "Lounge Owners" and "Lounge Staff" better insight of what is inside the different lounge functions and "How To" better use them to their own advantage. If anyone still needs help understanding the can fell free to contact any of Fubars Volunteer Coders and get the answers they need to better help them with whatever is relevant.

Lounge Wrapper

This section encovers the entire lounge and the content behind each of the functions below

This is the code that represents the wrapper

.new_lounge_wrapper {
  background-image: url('URL to image here');
  background-size: 100% 100%;
  background-attachment: fixed;
  background-position: 0% 0%;
  background-repeat: no-repeat;
}

Motd_Area

The MOTD is where most of a lounges main content goes into

This is the code that represents the MOTD

.new_lounge_wrapper div.new_lounge_motd_div {
visibility: visible;
}

Links / User_colors

Stevens

Chatbox Codecs

Saybox

The say box is the entry way into the chatbox portion.
Its pretty much where everything is typed before being placed onto the chatbox

say:

.new_lounge_wrapper div.new_lounge_shoutbox_enter_data {
  visibility: visible;
  margin: 10px;
  margin-bottom: none;
  width: 69%;
  height: 30px;
  position: relative;
  top: -360px;
  ~top: -26.5px; /*Controls Functions For IE7+*/
  _top: 0px; /*Controls Functions For IE6 & Below*/
  border-top: 2px groove rgb(255,165,0);
  border-left: 2px groove rgb(255,165,0);
  border-right: 2px ridge rgb(255,165,0);
  border-bottom: 2px ridge rgb(255,165,0);
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

.new_lounge_wrapper form#new_lounge_enter_data_form input {
  width: 90%;
  background-color: rgb(248,248,255);
  font-size-adjust: 0.58;
  color: rgb(0,0,0);
}

Chatbox

The chatbox is where eveything that was typed in the saybox gets placed

Stevens: This is the text for staff members delete

SCRAPPER: This is the text for non-staff members.. delete

.new_lounge_wrapper div.new_lounge_shoutbox_div {
  visibility: visible;
  height: 800px;
  width: 69%;
  overflow-y: scroll;
  overflow-x: auto;
  margin: 10px;
  background-color: rgb(0,0,0);
  position: relative;
  top: -375px;
  ~top: -38px; /*Controls Functions For IE7+*/
  _top: 0px; /*Controls Functions For IE6 & Below*/
  border-top: 2px groove rgb(255,165,0);
  border-left: 2px groove rgb(255,165,0);
  border-right: 2px ridge rgb(255,165,0);
  border-bottom: 2px ridge rgb(255,165,0);
  filter: alpha(opacity=100);
  -moz-opacity: 1.00;
  opacity: 1.00;
  -khtml-opacity: 1.00;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

Staff / Non-Staff Codecs

Below is the extra areas (ie. Enter/Exit/Subscribe/Rounds/Notices).

Staff	Non-Staff
.new_lounge_wrapper span.new_lounge_staff_shout { color: rgb(255,255,0); font-size: 10pt; font-family: arial, times new roman, san sarif; font-weight: bold; }	.new_lounge_wrapper td.lounge_shout_msg { color: rgb(248,248,255); font-size: 10pt; font-family: arial, times new roman, san sarif; text-align: left; }
Enter Notice	Exit Notice
.new_lounge_wrapper td.lounge_enter_notice { visibility: visible!important; font-size: 10pt; color: rgb(248,248,255); font-family: arial, times new roman, san sarif; }	.new_lounge_wrapper td.lounge_exit_notice { visibility: visible!important; font-size: 10pt; color: rgb(248,248,255); font-family: arial, times new roman, san sarif; }
Round Notice	Emote Notice
.new_lounge_wrapper td.lounge_round_notice { visibility: visible!important; font-size: 10pt; color: rgb(248,248,255); font-family: arial, times new roman, san sarif; }	.new_lounge_wrapper td.lounge_shout_emote { visibility: visible!important; font-size: 10pt; color: rgb(248,248,255); font-family: arial, times new roman, san sarif; }
Subscribe Notice	Chatbox Notice
.new_lounge_wrapper td.lounge_shout_subscribe { visibility: visible!important; font-size: 10pt; color: rgb(248,248,255); font-family: arial, times new roman, san sarif; }	.new_lounge_wrapper td.lounge_shout_notice { visibility: visible; font-size: 10pt; color: #7FFF00; font-family: arial, times new roman, san sarif; }
Lounge Room Notice
.new_lounge_wrapper div.new_lounge_notice_div { junk; color: rgb(0,255,0); 2; top: 550px; left: 350px; }

Lounge_Info

The Lounge Info box is where all the lounges information is held
(ie. Lounge Name, Subscribed Members, Date Lounge was Created, and The Owner of the Lounge)

lounge info


name:	Lounge Name Here
members:	??
created at:	2007-09-24 05:00:00
created by:	Owner Name Here

.new_lounge_wrapper div.new_lounge_info_div {
  visibility: visible;
  background-color: rgb(0,0,0);
  top: -50px;
  right: 0px;
  filter: alpha(opacity=95);
  -moz-opacity: 0.95;
  opacity: 0.95;
  -khtml-opacity: 0.95;
  position: relative;
  width: 25%;
  margin: 10px;
  margin-bottom: 5px;
  clear: right;
  overflow-x: hidden;
}

.new_lounge_wrapper div#new_lounge_info_div {
  border-top: 2px groove rgb(255,165,0);
  border-left: 2px groove rgb(255,165,0);
  border-right: 2px ridge rgb(255,165,0);
  border-bottom: 2px ridge rgb(255,165,0);
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

.new_lounge_wrapper table.lounge_info {
height: 15%;
}

.new_lounge_wrapper th.lounge_info {
  font-size: 16px;
  color: rgb(255,0,0);
  padding: 5px;
  font-family: arial, times new roman, san sarif;
  font-weight: bold;
  border-bottom: 1px groove rgb(248,248,255);
}

.new_lounge_wrapper td.lounge_info {
  zoom: 100%;
  font-size: 12px;
  background-color: transparent;
  color: rgb(248,248,255);
}

.new_lounge_wrapper td.lounge_info a {
color: rgb(248,248,255);
font-weight: bold;
}

Lounge Options

The Lounge Options box is where all the main lounges links are contained

lounge options

.new_lounge_wrapper div.new_lounge_opts_div {
  background-color: rgb(0,0,0);
  top: -55px;
  right: 0px;
  filter: alpha(opacity=95);
  -moz-opacity: 0.95;
  opacity: 0.95;
  -khtml-opacity: 0.95;
  position: relative;
  width: 25%;
  margin: 10px;
  margin-top: 5px;
  margin-bottom: 5px;
  padding: none;
  clear: both;
}

.new_lounge_wrapper div#new_lounge_opts_div {
  border-top: 2px groove rgb(255,165,0);
  border-left: 2px groove rgb(255,165,0);
  border-right: 2px ridge rgb(255,165,0);
  border-bottom: 2px ridge rgb(255,165,0);
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

.new_lounge_wrapper table.lounge_opts {
height: 15%;
}

.new_lounge_wrapper th.lounge_opts {
  font-size: 16px;
  color: rgb(255,0,0);
  padding: 5px;
  font-family: arial,times new roman, sans serif;
  font-weight: bold;
  border-bottom: 1px groove rgb(248,248,255);
}

.new_lounge_wrapper td.lounge_opts {
  text-align: left;
  padding: 5px;
  font-size: 14px;
  background-color: transparent;
}

.new_lounge_wrapper td.lounge_opts a {
font-weight: bold;
color: inherit;
}

Online_Member_Box

The Lounge Online Member box shows who has entered into the lounge.
When the member leaves the image will disappear from the same box.

.new_lounge_wrapper div.new_lounge_online_user_list_div {
  background-color: rgb(0,0,0);
  text-align: center;
  height: 250px;
  width: 26%;
  overflow-y: auto;
  overflow-x: auto;
  position: relative;
  top: -115px;
  ~top: -60px; /*Controls IE Functions*/
  right: 0px;
  filter: alpha(opacity=95);
  -moz-opacity: 0.95;
  opacity: 0.95;
  -khtml-opacity: 0.95;
  border-top: 2px groove rgb(255,165,0);
  border-left: 2px groove rgb(255,165,0);
  border-right: 2px ridge rgb(255,165,0);
  border-bottom: 2px ridge rgb(255,165,0);
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
   1;
}

Pretty much this concludes the easy portion of "Fubars Lounge Functions".

If you have any additional questions on coding lounges or any other coding in general
you can either message me or you can contact a Volunteer Coder.

Be on the lookout for the Live version of a Lounges Code (Comming Soon).