2091
Dec 18 2006, 10:42 AM
like in the topic, here is a description how to change the Backgroundcolor "On The Fly", by klicking on a button or radio-box first, we ned the html-and body-tags, create a new html-file on your desktop and write the following: QUOTE <html>
<body>
<script language = "JAVASCRIPT">
</script>
</body>
</html> browser interpretation: html - tag means "hey, browser, here comes HTML" in the body-tag you define the looking of your site. you can add things like "bgcolor" for the background, "text" for the textcolor and link / alink / hlink / vlink to define the linkcolor (<body bgcolor='#000000' text='#FFA500' link='#FFA500' vlink='#FFA500'>) the scripttag is the tag, we'll need now (sorry, but my english isn't very well) modify your file and type in the SCRIPT - TAG: CODE
function bgcsel(color){
document.bgColor=color;
}
this is the function, witch will change the bgcolor. now we'll type the rest, to let the function go: write between the html tags CODE
<input type = radio onClick = java script:bgcsel('#FFA500')>switch to Orange
<input type = radio onClick = java script:bgcsel('#FF0000')>switch to Red
<input type = radio onClick = java script:bgcsel('#000000')>switch to Black
now, when you look at the site andd klick on a radiobutton, the bgcolor will change BTW: try to replace the "onClick" by "onMouseover" the final file looks like this: CODE
<html>
<body>
<script language = "JAVASCRIPT">
function bgcsel(color){
document.bgColor=color;
}
</script>
</body>
</html>
simple color changer 
Reply
MetalGear
Dec 22 2006, 05:30 PM
nise thing thanks for sharing man i learn something new thanks again
Reply
Kioku
Dec 23 2006, 05:17 AM
This could be interesting, but I have some doubts as to its usefulness.
Reply
cybermandu
Dec 23 2006, 08:20 AM
nice script i think this would be helpful for the webdesigners
Reply
sportytalk
Dec 25 2006, 02:02 AM
This is a nice tutorial including some simple html and javascript scripts. As said in one of the above posts, these scripts certainly help the web designers add more dynamic content to their websites. It is important to note though, that internet browsers allow you to disable javascript code. If your users have javascript disabled, they will not be able to see the dynamic features which you intend for them to be able to view. You need to be aware of this and ensure that there isn't too great a dependency for using Javascript. Nice code though, will certainly help those who are looking for codes similar to the ones you have posted in this tutorial. Thanks for sharing
Reply
zamaliphe
Oct 18 2007, 12:30 AM
will i thought it will be the dampest tutorials but i was wrong i learned some thing new today thanks 
Reply
suberatu
Oct 20 2007, 11:36 PM
It's pretty easy stuff, but useful for those who don't have any background in webcoding/design and want to be able to know how to do this kind of stuff.
Reply
azri92
Mar 20 2008, 09:31 AM
thanx for that post...
Reply
Similar Topics
Keywords : simple, scripts, html, javascript, things, backgroundcolorchanger
- How To: Html Tables.
I find these really useful. (8)
Simple Javascript And Password System
How to protect your pages with password (5) The quickest way to get a password protection system up and running is to use a Prompt box in
JavaScript that has a title like "Enter your Email Address". Only you and the relevant users know
what the password should be, could even be one each, that can be sorted out at the next page then
pass the "input" directly through the url by changing the .href, like
http://www.iSource.net.nz/users/?leTmeIn= The page that then processes this should also check for
the referring page, and three fails from an IP if you like the php (the next page): CODE
<?php // processdo....
[php] Clean Code Functions
Clean up your html output from php scripts (5) There is another Topic about writing 'clean' HTML code posted elsewhere on the Forum.
I'll edit this Topic and add the link so you can review it on your own, and there is no need for
me to comment on it in this thread, but the purpose of this Topic is to introduce a pair of
functions which can be used for making sure that the HTML output from my scripts is readable when a
view-source is reviewed. Two handy functions are included here. They work together quite nicely,
and I will start this Tutorial with a short summary of the reasons for their 'being....
Cakephp On Ubuntu
using your own public_html folder (0) Hi, there are many tutorials about this, but i would like to type the steps i followed in order to
get cakephp working on my user public_html folder. as many of you probably know, if you have
apache's userdir module loaded, you can put your web pages on /home/user/public_html , and
access them with the url: http://localhost/~user/ . I really prefer this, so all my web pages are
on my personal home, but how to configure cakephp to work with these paths, i got a hard time with
this, but finally got it!. here's how: in case you don't have apache2's u....
Html Span
(7) HTML Span Description The span tag is quite the handy tag to have at your disposal. You can use
it for everything from Text Formating, to creating a scrollable text area. When combined with CSS it
becomes an easy-to-use tool for making your website as uniform as possible, as your not bogged down
with tags for every heading and title on your website. Try It Out CODE <html>
<body> <div class="content"> <span class="heading1"> Heading
or title goes here. </span><br><br> All the content insi....
Html Bdo...
(13) Description I find that it is often difficult to write a sentence backwards, but thanks to HTML, I
can now complete this task in only a few seconds. Now the only problem is it is very difficult to
read... Try It Out Welcome to one of the most useless functions of HTML. The tags enable you to
write a sentence backwards. The code is quite simple. CODE <bdo dir="rtl">I
find that it is often difficult to write a sentence backwards, but thanks to HTML, I can now
complete this task in only a few seconds. Now the only problem is it is very difficult to r....
Want-to-start Html Tutorials
An HTML tutorial that covers the basics (2) NOTE: Don't use a rich text editor* for writing HTML code! Use Notepad in Windows,
SimpleText in Mac or TextEdit in OSX, but you must set the following preferences for the HTML code
to work! In the Format menu, select Plain Text. Open the preferences window from the Text
Edit menu, then select "Ignore rich text commands in HTML files." Start Creating Your Own HTML
File You can either use HTM or HTML file extensions. For more information, visit:
http://filext.com/file-extension/htm for HTM or http://filext.com/file-extension/html for HT....
Creating Navigation For Html Websites
Have a common navigation menu for the whole website! (12) Pre-requisite: HTML, inline frame tags 1 Attachment(.zip) included. Updates : 29-12-07: Doctype
added in example files (Advised by jlhaslip) Designing a whole website takes a lot of planning
and organization. Designing a proper navigation system is a basic step in building your website. If
you are developing webpages in html you would have observed that as you go on creating pages it
becomes difficult to maintain the links to the pages. This article will guide you in developing a
common navigation menu for your website. It describes three ways, so if you don'....
Create A Simple Html Editor With Php And Javascript
(3) Ok, I will teach you how to create a simple HTML editor that runs online with buttons that add HTML
tags. Before we start: You should have basic knowledge of these languages. HTML/XHTML
Javascript PHP You will need Ability to use filesystem functions. Chmodding abilities
Features of Editor Online PHP safe Full HTML support A Few Bad Features Can only create new
documents or overwrite Fairly unsafe Now we are ready to begin. The PHP Script This will be
our PHP script that we will use to make the file. Make a file called save.php Here is the....
Html Legend
Learn how to create a handy legend with HTML! (9) I think this is pretty neat... good for those people who maybe aren't that great at designing
things but still want something to look nice.. CODE <fieldset> <legend>Legend
title</legend> Content </fieldset> try it in note pad.. it looks nice...good for
forums, sign up forms.......
How To Install Php Scripts
for people who don't like uploading all the time (0) OK. Here's what you need: 1. Web hosting that has FTP 2. A script or something to install 3.
A program called SmartFTP I'll use my site for an example... 1. Enter your FTP login info
2. When you login in your files, images, and stuff will show up. 3. Now that you're logged in
you have to choose what file you want to import into your website. Go to "My Documents" and right
click on the file you want to put on your site and select "copy". 4. Next you got to open put the
dictionary that your website is in. Ok what that means the place where the "i....
Mootools - My Favourite Javascript Library
(3) It kind of amazes me that there's not even a mention of the Mootools javascript library
throughout this whole forum. So here I'll do a brief introduction and a tutorial on how to
produce the famous accordion effect. MooTools is a compact, modular, Object-Oriented javascript
framework designed to make writing extensible and compatible code easier and faster. MooTools lets
you get the job done efficiently and effectively. It is slightly based on the powerful Prototype
javascript framework , of which Scriptaculous runs on. (But frankly, I dislike Scriptaculou....
Spice Up Your Forms
With a bit of CSS and HTML alignment (11) Ever wonder how to make those stylish forms you see everywhere? Well now it's your change to
learn. This short tutorial will show you how to do exactly that. Here is a bit of css to spice
up the form. I have included comments to explain what classes will change what in the forms.
CODE <style type='text/css'> .form table { background-color: #187cae; }
/*The following css class will change the table cells within the .form div */ .form td {
background-color: #bbe0f4; padding: 3px; border: 0px; ....
Javascript Scroll Bar
A scroll bar for your webpage using javascript (13) In this tutorial I will show you how to create two buttons in the bottom left of the screen that,
when hovered over, will scroll the page. Now to start with, we must create a our buttons, the first
line will create a div element, or block. Using blocks you can position items anywhere on a page.
We use the ID property just to let us know what the block is used for, as for the first block, its
obvious that it contains the vertical buttons and the second two blocks contains the horizontal
buttons. The style property of the div tag tells the browser how to draw it, in the....
Do You Want To Use Php Code In Your Html Pages?
Within two minutes you will! (9) Whilst searching around for help to setup cutenews blog I came across a way to use php in html pages
- lo and behold it works! so I thought I'd share it with you all (Unfortunately I can't
remember the site so I wrote this up a couple of minutes after I did it:) ). This method requires a
web server with apache installed. So, luckily for us all this covers the whole of Trap17... even
Qupis /tongue.gif" style="vertical-align:middle" emoid=":P" border="0" alt="tongue.gif" /> Just
to make the point, this is in no way a difficult task and it doesn't requir....
How To Make A Simple File Based Shoutbox Using Php And Html
(8) A simple tut to make a simple shoutbox. Let me jump right in. First of all you need the standard
equipment for PHP, an IDE like XAMPP and an editor like PHP EDITOR 2OO7. Were going to make a
simple guestbook using three files, webpage.php, shout.php and shout.txt. Webpage.php can be
changed to whatver you want, it will be the page on which the guestbok is shown, you could even use
this code and add it to another php page n your site. Shout.php is the proccessing page and
shout.txt is where the shouts are stored. Firstly we need to make the visual design of the box.....
Document Type Declarations
And why we use them in html pages (0) This code: CODE <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"> <html> <head>
<title>HTML 4.0 Strict document</title> <meta
http-equiv="content-type" content="text/html;charset=utf-8" > <meta
http-equiv="Content-Style-Type" content="text/css" > </head>
<body> <p>... Your HTML content here ...</p> <p>... More
HTML content here ...</p> </b....
Fast Template Design In Joomla Cms
Basic knowlege of Html needed (2) Joomla is one of the most powerfull CMS sistems around. It is free under GNU/GPL license and
everyone with simple knowlege of webdesign (and even without it) can use it for it's website.
For now the only way i know on how to design a template in joomla is by using Dreamweaver and Joomla
(joomlasolutions1.0.mxp-dreamweaver.mxp) extension for dreamweaver! Template design in joomla
is quite simple really. This template that i'll show you is the most simplest of them all, but
it's enough for one to learn Basics of template design. Further notice is that this....
Integrating Html And Css Part 1
(5) Ok. Well i am writing this as a series of tutorials i will be doing on this subject, so enjoy. I
hope this helps. Introduction to HTML and CSS
HTML and CSS are to work together. HTML is what puts the characters on the page, while CSS is what
makes everything look outreageous! For instance, I would use HTML if i wanted to put "Trap17 is
the poop!" onto my page, although if i wanted to make it look nice like this by adding a font,
and maybe some color, then I would use CSS. Learn the HTML. Ok this is my lit....
Cpanel Preinstalled Scripts, Extras, And Cpanel Options
Part 6 of My 7 Part Tutorial (1) This Tutorial will be divided into 7 different parts, and this is the first part, when i get the
other parts together, i will post the links under here /biggrin.gif" style="vertical-align:middle"
emoid=":D" border="0" alt="biggrin.gif" /> Enjoy. Part 1: E-mail Management Part 2: Useful Site
Management Tools Part 3: Useful Site Management Tools2.1 Part 4: Analysis/Log Files Part 5:
Advanced Tools Part 7: Fantastico Detailed Cpanel Tutorial Part 4: PreInstalled Scripts,
Extra, and Cpanel Options In this tutorial I will, in detail explain all of th....
Fantastico Scripts - A 'how To'
(0) This isnt really a tutorial, more like an idiots guide on how to avoid the problems I encountered
when setting up my site. This eventually invoved 3 complete reinstalls - you soon learn from your
mistakes when that happens. I shall use php-nuke as the example here, but it applies to all scripts
you intend to modify. If you have the disk space available - install your script twice, set up a
temporary sub-domain for this. The reason for this is you have a full, clean install to go back &
retrieve any files you may mess up whilst changing code (you will have to do this ....
Javascript Framework - A Shortcut Javascript
a shortcut javascript (3) hi, today im going to give you small tutorial how to use `Prototype JavaScript Framework`
1st you have to download `Prototype JavaScript Framework`library from
http://prototype.conio.net/ prototype makes easy to using Javascript, ex : when you want to point
(get) the element from HTML usually we use : CODE
document.getElementById('elementId') with prototype we use CODE
$('elementId') , yeah...world getting small..with prototype. example
we`re going to get value from an element of CODE &#....
How To Create Html Page Anchors
Click A Link And Take You To A Certin Place On The Same Page (5) Have you ever wondered how people have a normal link but all it does it take you to the middle of a
long page? well here is a solution DEMO: Here Ok well first off for the link it will be just
like a normal link code except you wont put a http://URL.com/file.php it will look somthing like
this QUOTE name ">Click This Link! there must be a # sign in front of this to work..
now, for the content that the person will be re-directed to after clicking the link QUOTE name
"> the items in bold is what you need to change QUOTE name "> i....
Tool Tips Using Only Css To Pop Up The Tool Tip
No javascript involved! (8) Tool Tip Tutorial Example Found Here . Please review before continuing. Nice. And no
javascript at all to be found. The colours I have used are for demonstration purposes only to show
you that they are adjustable to suit the background or to contrast against them. Your choice. That
is a styling issue. It is your site, you decide. The original author's idea was to add
position:relative to the link, in order to allow the span element inside to position absolutely
in respect to the parent link. This code has been tested in Ie5.5, IE6, Opera7.11 and M....
Multiple Classes In Html
you can use more than one at a time (8) Multiple Classes in Css Styles Classes are used in html pages to give certain defined
attributes to elements. They are useful when the attributes are to be used in more than one place on
a page. (Named Id's are only allowed once per page, but I digress... might have a tutorial on
that some day.) Sometimes you want Red text and sometimes you want Bold text. Easy enough to do,
simply define a class and apply it to the element you want red or bold. Use this class where you
want on the page, since classes are enabled to be used in several spots, for different u....
Image Rollovers In Javascript
A Write-Once, Use-Anywhere Approach (11) Tutorial: Image Rollovers w/ Javascript, by Rob J. Secord, B.Sc. (SystemWisdom) See a
working Sample of this Script! Download a ZIP containing all working files in this
tutorial! Note: If you are not interested in reading this entire tutorial and/or have a basic
understanding of the underlying concepts, you may safely skip to the Implementation section to get
the code! Description : A Dynamic Image Rollover Script tested to work in 4 major internet
browsers: MSIE, FireFox, Netscape and Opera. Using only Javascript combined with regular HT....
Basic Html (for Us Kids)
(23) What is HTML? HTML (hypertext markup language) is computer language that is used to webpages. It
can be confusing to understand for some of us kids. HTML pages are text files that has of HTML tags
(they can place the text or images whereever you want to place it), and text you can place between
the tags so the text willshow up on your page when you put it on the WWW. Tags are instructions that
tell your browser what to show on ya website. They break up your webpage into basic sections. All
tags start with a (right bracket). If you are a starter you need 4 tools A....
Image Preloader With Progress Bar Status
Pure Client-Side JavaScript tested in 4 Browsers! (22) Tutorial: Image Preloader with Progress Bar, by Rob J. Secord, B.Sc. (SystemWisdom)
Description : A Tutorial for a Client-Side Image Preloader with Dynamic Real-Time Progress Bar
Indicator written in JavaScript! Tested to work with 4 Major Internet Browsers: Firefox, MSIE,
Netscape, Opera (Complete sample solution provided at end of tutorial, just put it on your
web-server, add your images and go!) Intended Audience : Beginner to Intermediate Web
Developers. Although this tutorial will cover some advanced aspects of JavaScript, I will try to
explain....
Check Your Scripts
(4) As I am reading through some of the (Mostly PHP) scripts posted here, the following posts are that
of people saying that the script does not work. I suggest that you should test and make sure that
your script works BEFORE you post it here. Craig.....
HTML tags and examples
Condensed form of course from my site... (37) Well, I decided to try and help out some of the users here who might be unexperienced in HTML, so I
condensed the begginer's HTML course at my website. Here it is... Lesson 1 HTML means Hyper
Text Markup Language. HTML is a very common language used for many websites, is the base for more
complicated and powerful langauges like php, HTML can seem hard, but you will find it is one of the
easiest langauges one can learn. The core of HTML is the tag, a tage is just a set of two
arrows-like brackets created by hitting Shift and the comma key, or Shift and the period....
Looking for simple, scripts, html, javascript, things, backgroundcolorchanger
|
|
Searching Video's for simple, scripts, html, javascript, things, backgroundcolorchanger
|
advertisement
|
|
