MARQUEE-Scrolling text and link hacks andrey понедельник, 22 июня 2015 г. No Comment

UPDATE:  I updated some of my posts, this post I update click this link........

STEP #1

Log in to Blogger, go to Layout ->Add a Gadget of HTML/JavaScript type. 


Then add this code in to it:


Here is the code to add a simple scrolling text from right to left side

code to simple scrolling text

The output:.....

code to simple scrolling text

If you want some more attention of your Viewers,








         Change the Background color to the text,


         Note: Use matching and favourable colours that look good with each other.




code to simple scrolling text

The output:.....

code to simple scrolling text

You can choose your background colour by replacing the hexadecimal code(#99ccff).Click here to see the codes of the different colors.
Here are some mode attributes to learn:

direction="left"

direction="right"

direction="up"

direction="down"

The above attributes tells the text which direction to scroll.

Apply whichever you want

code to simple scrolling text

Here are its examples   ....................

code to simple scrolling text

code to simple scrolling text

code to simple scrolling text

code to simple scrolling text

More attributes:
                              You can add this attribute to alternate the text means it will bounce within the coloured area.

Like this

code to simple scrolling text





Its Code:-

code to simple scrolling text

You can also set the speed up the widget text with a simple attribute:

scrollamount="2"

The lower the scroll amount value, the less speed it moves,
the html code adding scrollamount would be

code to simple scrolling text

(for scrollamout =2) in this marquee it would be at this speed

code to simple scrolling text

(for scrollamount=10)

code to simple scrolling text

TWO

        Pausing the text when mouse is over the text:         It is very useful when the reader wants to read the text,and the scrollamount is big,sothat he will put the mouse           over the text to pause the text and read the matter:
        Here is the code for it

 code to simple scrolling text

It will have the following feel

 code to simple scrolling text

(Roll the mouse over the text)

           THREE

           Changing the text colour:
           Here is the code to change the text colour:(Add it before the marquee tag)

The whole code would be like 

code to simple scrolling text

code to simple scrolling text

Here is the important and most useful one, adding hyperlinks in the scrolling text 
Hyperlink means a link when clicked go to another location(site).
Let's see how to add hyperlinks to the scrolling text:

FOUR

Adding hyperlinks(open in the same window):

sample sode for it.

 LINK#1 LINK#2 LINK#3 

Replace the Link#1,Link#2,Link#3 with the text and url#1,url#2 and url#3 with the desired url addresses.

 your link Colour chart google

 

 your link Colour chart google

 

If you want to open the links in new window,here is the code:

Here's the code for it

 LINK#1 LINK#2 LINK#3 

That's it!Now you can add this to your blogger sidebar,in the blog post,where ever you want.

If you want to put this in sidebar,then sign in to your blogger account>click the add a page element> and paste the code in html/javascript and save the changes .This is shown in the below pictures.

happy marqueeing

 

UPDATE:  I updated some of my posts, this post I update click this link........

STEP #1

Log in to Blogger, go to Layout ->Add a Gadget of HTML/JavaScript type. 


Then add this code in to it:


Here is the code to add a simple scrolling text from right to left side

code to simple scrolling text

The output:.....

code to simple scrolling text

If you want some more attention of your Viewers,








         Change the Background color to the text,


         Note: Use matching and favourable colours that look good with each other.




code to simple scrolling text

The output:.....

code to simple scrolling text

You can choose your background colour by replacing the hexadecimal code(#99ccff).Click here to see the codes of the different colors.
Here are some mode attributes to learn:

direction="left"

direction="right"

direction="up"

direction="down"

The above attributes tells the text which direction to scroll.

Apply whichever you want

code to simple scrolling text

Here are its examples   ....................

code to simple scrolling text

code to simple scrolling text

code to simple scrolling text

code to simple scrolling text

More attributes:
                              You can add this attribute to alternate the text means it will bounce within the coloured area.

Like this

code to simple scrolling text





Its Code:-

code to simple scrolling text

You can also set the speed up the widget text with a simple attribute:

scrollamount="2"

The lower the scroll amount value, the less speed it moves,
the html code adding scrollamount would be

code to simple scrolling text

(for scrollamout =2) in this marquee it would be at this speed

code to simple scrolling text

(for scrollamount=10)

code to simple scrolling text

TWO

        Pausing the text when mouse is over the text:         It is very useful when the reader wants to read the text,and the scrollamount is big,sothat he will put the mouse           over the text to pause the text and read the matter:
        Here is the code for it

 code to simple scrolling text

It will have the following feel

 code to simple scrolling text

(Roll the mouse over the text)

           THREE

           Changing the text colour:
           Here is the code to change the text colour:(Add it before the marquee tag)

The whole code would be like 

code to simple scrolling text

code to simple scrolling text

Here is the important and most useful one, adding hyperlinks in the scrolling text 
Hyperlink means a link when clicked go to another location(site).
Let's see how to add hyperlinks to the scrolling text:

FOUR

Adding hyperlinks(open in the same window):

sample sode for it.

 LINK#1 LINK#2 LINK#3 

Replace the Link#1,Link#2,Link#3 with the text and url#1,url#2 and url#3 with the desired url addresses.

 your link Colour chart google

 

 your link Colour chart google

 

If you want to open the links in new window,here is the code:

Here's the code for it

 LINK#1 LINK#2 LINK#3 

That's it!Now you can add this to your blogger sidebar,in the blog post,where ever you want.

If you want to put this in sidebar,then sign in to your blogger account>click the add a page element> and paste the code in html/javascript and save the changes .This is shown in the below pictures.

happy marqueeing

 

Tweet

by Jillur Rahman

Jillur Rahman is a Web designers. He enjoys to make blogger templates. He always try to make modern and 3D looking Templates. You can by his templates from Themeforest.

Follow him @ Twitter | Facebook | Google Plus

Tags: hacks / MARQUEEScrolling