473,402 Members | 2,050 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,402 software developers and data experts.

Color cycling

Hi I have a general question about cycling background colors.

when using

background color: rgb(0,0,0)

is it ok to write

Expand|Select|Wrap|Line Numbers
  1. if {i<250){
  2.  
  3. i++;
  4. }
  5. else(i == 250){
  6. i= 0;
  7. i++
  8. }
  9.  
  10. background color: rgb(i,0,0)
  11.  
This is pseudo code.

I tried doing this for the background color of a text field which I set with css however, the css wouldnt read it.

I am just wondering if there are any special constraints on rgb(0,0,0,) which dont allow you to use looping varibles?

Seasons Greetings.
Dec 25 '08 #1
8 2041
gits
5,390 Expert Mod 4TB
have a look at the following example the shows you how you might use it:

Expand|Select|Wrap|Line Numbers
  1. <html>
  2.     <script type="text/javascript">
  3.         var my_color = 'rgb(0,0,0)';
  4.  
  5.         function colorize() {
  6.             var n = document.getElementById('foo');
  7.             var r = /([\d]+)/;
  8.             var c = parseInt(my_color.match(r), 10);
  9.  
  10.             if (c < 250) {
  11.                 c += 10;
  12.             } else {
  13.                 c = 0;
  14.                 c += 10;;
  15.             }
  16.  
  17.             my_color = my_color.replace(r, c);
  18.             n.style.backgroundColor = my_color;
  19.         }
  20.     </script>
  21.     <body onload="colorize();">
  22.         <input type="text" id="foo"/>
  23.         <input type="button" value="colorize" onclick="colorize();"/>
  24.     </body>
  25. </html>
  26.  
kind regards
Dec 25 '08 #2
Thanks Gits,

It is very kind of you to write the code.

I do have some trouble underrstanding the example for instance

var r = /([\d]+)/; ( I have no clue what this syntax means) what are the slashes?

var c = parseInt(my_color.match(r), 10); ( am I right to infer that this matches the value passed to the array d and increments it by 10.

I will be studying this example for a while to understand the logic underlying it.

If you have any general comments on how you did this I would appreciate hearing them.

In any case Merry Christmas, and Happy New Year.
Dec 26 '08 #3
Dormilich
8,658 Expert Mod 8TB
@Rajneesh Chellapilla
the forward slashes are the RegEx delimiter characters, \d simply means "any digit" (like \n means "new line")

@Rajneesh Chellapilla
nope, the 10 denotes the number system (decimal). parseInt() converts its input to a number.

regards
Dec 26 '08 #4
gits
5,390 Expert Mod 4TB
yes ... dormilich explained it already ... i just used the regExp to shorten the replacement of the first rgb-value that we need to use as a string-value for the setting of the css-property - and the regExp is quite handy for string-operations like the replace() method ;)

kind regards
Dec 26 '08 #5
Thanks much,

I will use this example and use a set time method so the color cycles automatically. I will let you know how it goes. My goal is to make a series of cycling color squares, as a personal art project.

I will be studying this example for a while though, as I never heard of reg expression before.

Is there a way to do this example with out reg expression?
Dec 27 '08 #6
gits
5,390 Expert Mod 4TB
of course ... you may do it without regExp ... you just need to construct a string that you may assign to the css-property like that:

Expand|Select|Wrap|Line Numbers
  1. var r = 100;
  2.  
  3. var my_color = 'rgb(' + r + '0,0)';
  4.  
  5. n.style.backgroundColor = my_color;
  6.  
kind regards
Dec 27 '08 #7
Thanks Gits,

I hope one day I will be able to program as well as you.



('Cheers' + 'Happy.New.Year';)
Dec 29 '08 #8
gits
5,390 Expert Mod 4TB
... hope you will avoid all those bugs i always make ;) ... its just experience and the quantity of code that you will produce in a specific language that will let you advance in a special field of programming ... i'm sure you will advance in JavaScript when you just write more and more complex code that you need for your projects ... and i'm even sure that when this will be the case then you will start to see the 'beauty' of JavaScript ... its really a nice language ;)

in case you need more help or explainations, just post back to the forum ...

kind regards
Dec 29 '08 #9

Sign in to post your reply or Sign up for a free account.

Similar topics

4
by: dan glenn | last post by:
(PHP4.3.4, GD2) How can I save a PNG using GD2 and insure that it saves as a palette-based (8-bit, 256-color) single-color transparancy?? Saving this way, I could be sure that an image loaded from...
6
by: me | last post by:
good day, i found this message: and i want to know more about it too. ========================================== Hey all, example:...
6
by: rzed | last post by:
I'm using PIL to generate some images which may be rotated at the user's option. When they are rotated, the original image is cropped in the new image (which is fine), and the corners are black...
3
by: Richard A. DeVenezia | last post by:
I hope this is the end of my present 'discovery' phase. I've learned alot about JavaScript in a short time and my head hurts. The following is what came out of all my questions and all the...
5
by: Chris Beall | last post by:
I'm displaying an image that is also a link against a black background. In Netscape 7.1, the current background color is displayed as a horizontal bar below the image. This allows :hover effects...
3
by: robbiehenry | last post by:
1. robbiehe...@gmail.com Sep 19, 1:48 pm show options From: robbiehe...@gmail.com - Find messages by this author Date: Mon, 19 Sep 2005 10:48:50 -0700 Local: Mon, Sep 19 2005 1:48 pm...
4
by: crescent_au | last post by:
Hi all, I'm doing some research online on creating php-based multi-level marketing (MLM) system. It seems like a complicated system to build as I need to create one from scratch. I'd like to...
8
by: Marco Pais | last post by:
Hi there. How can I change the background color of a textbox when it gets the focus? I can handle the "Enter" event and do this private void txtDummie_Enter(object sender, EventArgs e) { ...
3
by: jock1up | last post by:
I am working with javascript...where I have cycling banners at the top, 3 of them and I need to make two of them clickable to a website that I assign to the two. bannerad2 for www.bigmtn.com and...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.