Techblog

Technical Blog about all things computer

  • Sep 26

    How to make font automatically alternate font colors with Javascript

    <SCRIPT type=text/javascript>

    //Alternating font colors

    function alternatingColors(idname) {

    var speed = 300;   // Speed between one color to the next

    var first_color     = ‘#ff0000’;    //First color Hexadecimal required

    var second_color    = ‘#0000ff’;    //Second color Hexadecimal

       //We are converting the first color to RGB because firefox style.color is in RGB format

    var rgb_color  = “rgb(” + HexToR(first_color) + “, ” + HexToG(first_color) + “, ” + HexToB(first_color) + “)”;

          s = document.getElementById(idname);

    if (typeof(s) !== ‘undefined’)  {

    s.style.color =( (s.style.color == first_color)|| (s.style.color == rgb_color))? second_color : first_color;

    setTimeout(‘alternatingColors(\”+ idname +’\’)’,speed); 

    }

    }

     

    //Hex to RGB Converter Code obtained from http://www.javascripter.net/faq/hextorgb.htm

    function HexToR(h) {return parseInt((cutHex(h)).substring(0,2),16)}

    function HexToG(h) {return parseInt((cutHex(h)).substring(2,4),16)}

    function HexToB(h) {return parseInt((cutHex(h)).substring(4,6),16)}

    function cutHex(h) {return (h.charAt(0)==”#”) ? h.substring(1,7):h}

     

    </SCRIPT>

     

    <body onload=”alternatingColors(‘blink_this_text’)”>

    <p id=blink_this_text> Blinking Text </p>

    </body>

     

    Summary: Upon loading the page, the onload function will call the alternatingColors function passing along the id of the paragraph, blink_this_text.  The interval is set to 300 milli seconds. First color is the first color to change to font to. It has to be in hexadecimal format because this is being converted to RGB because firefox’s style.color format is in RGB. The second color is the second color to change the text to. . It then gets the blink_this_text object using the getElemenbById command. If it exists and color is not the first color, then it will change the color to the second color. The alternatingColors function is called again using the setTimeout function.

    Hope this was helpful and happy coding.

  • Sep 26

     

     

    If you want a text to blink below is the function.

    <SCRIPT type=text/javascript>
     

     

    function blink(idname) {
    var speed = 300;

     

          s = document.getElementById(idname);
    if (typeof(s) !== ‘undefined’)  {

    s.style.visibility=(s.style.visibility==’visible’)?’hidden’:’visible’;

    setTimeout(‘blink(\”+ idname +’\’)’,speed); 

    }

    }

     

    </SCRIPT>

    <body onload=”blink(‘blink_this_text’)”>
    <p id=blink_this_text> Blinking Text </p>

    </body>

     

    Summary: Upon loading the page, the onload function will call the blink function passing along the id of the paragraph, blink_this_text.  The blink speed is set to 300 milli  seconds interval. It then gets the blink_this_text object using the getElemenbById command. If it exists. Visibility is set to hidden if it is visible otherwise it’s invisible. The blinking text function is then called again using the setTimeout function.

    Hope this was helpful and happy coding!

  • Sep 16

    MYSQL Basic Tutorial

    The aim of this tutorial is to help you familiarize with basic MYSQL commands.

    1.) How to show the available databases.

    show databases;

    2.) How to create a database. For example you want to create a database called “test_database”

    create database test_databaseee;
    3.) Oops. You made a spelling mistake, test_database has extra e’s. To drop database use

    drop database test_databaseee;
    4.) To create test_database again type:

    create database test_database;
    5.) To select a database so you can access the tables without a database prefix:

    use test_database;
    6.) To show available tables in a database.

    show tables;
    7.) To create a table:

    create table test_table (

    name varchar(50),

    age int);
    8.) To look at the columns and structure of the table you just created:

    show table test_table;

    9.) To insert data to the table created above:

    insert into test_table(name, age)

    values (‘Bill Gates’, 50);

    10.) To insert multiple values into a table, separate the values by a comma:

    insert into test_table (name, age)

    values (‘Steve Balmer’, 55),

    (‘Larry Ellison’, 51),

    (‘Albert Einstein’, 100);

    11.) To view the data in your table:

    select * from test_table;
    12.) To delete a record from your table. For example you want to delete “Bill Gates” from the example above:

    delete from test_table

    where name = ‘Bill Gates’;

    13.) To update a column in a table. For example you want to update Albert Einstein’s age:

    update test_table set age = ‘200’ where name = ‘Albert Einstein’;

    Hope this tutorial was helpful. Feel Free to post your questions and I will answer them.