Selamat Datang Di Blog Bisnis Online Terpercaya www.maslukis.com


Rabu, 12 Oktober 2016

MARQUEE-Scrolling text and link hacks




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



<marquee>code to simple scrolling text</marquee>
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.

<marquee style="color:#667C26;">code to simple scrolling text</marquee>

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

<br /><marquee direction="right" style="color:#99CCFF;">code to simple scrolling text</marquee><br />


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:

<marquee behavior="alternate" direction="down" bgcolor="#33FFCC">code to simple scrolling text</marquee>

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



<marquee behavior="alternate" direction="left" scrollamount="2" style="color:#9999CC;">code to simple scrolling text</marquee>

(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

<marquee behavior="alternate" direction="left" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" scrolldelay="50" style="color:#CCCCCC;">  code to simple scrolling text</marquee>

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)

<span style="#FFFFFF">


The whole code would be like 


<span><marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4" style="color:#cccccc;"><br /><br />code to simple scrolling text<br /><br /></marquee>




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.


<marquee behavior="scroll" direction="left" bgcolor="#99FFFF" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4">    <a href="url#1">LINK#1</a>  <a href="url#2">LINK#2</a>  <a href="url#3">LINK#3</a>  </marquee>

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


<marquee behavior="scroll" align="middle" direction="left" scrollamount="4" onmouseover="this.stop()" onmouseout="this.start()" style="color:#99FFFF;"><br /><br />    <a href="#your link">your link</a>  <a href="#">Colour chart</a>  <a href="http://www.google.com">google</a><br /><br />  </marquee>




    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


<marquee behavior="scroll" direction="left" bgcolor="#99FFFF" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4">    <a href="url#1">LINK#1</a>  <a href="url#2">LINK#2</a>  <a href="url#3">LINK#3</a>  </marquee>


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.

Blogger Widgets
happy marqueeing


Baca Juga:

Comments
0 Comments
 
Copyright © 2018. Info Hari Ini . All Rights Reserved
Jl. Delta Raya Utara Kav. 49 - 51 Deltasari Baru, Sidoarjo, Jawa Timur, Indonesia 61256
PT. Bimasakti Multi Sinergi