Client LoginView your Shopping CartHelp & Frequently Asked QuestionsEmail Us
Home Services Portfolio Web Design Pricing Dreamweaver Templates Web Applications Free Tutorials About Contact Us
Services > CSS Web Design | Professional Logo Design | ASP.net, ASP & PHP Programming | Flash Animation & Programming | Reliable Web Hosting | Website Maintenance
Portfolio > Web Design Portfolio | Web Programming Portfolio | Logo Design Portfolio | Web Design Pricing > Custom Web Design | Logo Design | Business Card Design
Free Web Design Guide > Website Design w/ Dreamweaver & Fireworks | Adobe Fireworks CS4 review | Photo Effects | Text Effects | Graphic Design Ideas | Web Design Ideas
Website Navigation Ideas | CSS Styles Tutorial | Dreamweaver Template | Server Side Includes | Flash Tutorials > Flash Effects | Flash Sound Button | Sound On/Off Button
Flash Preloader | Import External Data | Promotion > SEO Tips | Google Tips & Page Rank | JavaScript > Date Validation | Email Validation | Phone Validation | Tip Boxes

Text Scroller in Flash

How to create simple & advanced Flash text scrollbars using actionscript

This tutorial explains how to create simple and advanced scrollers for textboxes in Flash using Actionscript. When there is only a limited area for text in Flash, it sometimes becomes a necessity to have scrollers.

Recommended Version: Adobe Flash CS4 Professional

Compatible Versions of Flash for this Tutorial

Flash MX 2004 & below | Flash 8 | Flash CS3 | Flash CS4
Note: For uses of lower versions of Flash some visual interface images would differ.
Recommended Version: Adobe Flash CS4 Professional
You Are Here ::: Home >> Free Tutorials >> Flash Tutorials >> Text Scroller in Flash

Simple Scroller for Flash Textboxes

  1. In Flash, textboxes are of 3 types namely - Static, Dynamic & Input. The size of Dynamic/Input text varies depending on the source file/user input and hence may require the use of scrollers.
  2. Create a Dynamic textbox with Multiline property selected using the Properties panel, name the variable and the instance as 'addr' and 'scrtxt' respectively.
  3. Create 2 buttons for Upward and Downward scrolling and write the following Actionscript code:
  4. Upward Button
    on(press)
    {
    scrtxt.scroll=scrtxt.scroll-1;
    }

    Downward Button
    on(press)
    {
    scrtxt.scroll=scrtxt.scroll+1;
    }

  5. Save your work and test the Movie (Ctrl + Enter). That's it you have learnt how to create simple scrollers for textboxes in Flash using Actionscript.


Simple Scrollbars

Advanced Scrollers for Flash Textboxes

  1. Functions can be used to control the button's scrolling action to create a more advanced type of text scrolling as explained below.
  2. Write two Actionscript functions, scrup and scrdown for scrolling upwards and downwards as shown below:
  3. function scrup()
    {
    scrtxt.scroll=scrtxt.scroll-1;
    }

    function scrdown()
    {
    scrtxt.scroll=scrtxt.scroll+1;
    }

  4. Call these functions from the two Buttons using the following actionscript code:
  5. Upward Button
    on(press)
    {
    upint=setInterval(scrup,100);
    }

    on(release)
    {
    clearInterval(upint);
    }

    Downward Button
    on(press)
    {
    downint=setInterval(scrdown,100);
    }

    on(release)
    {
    clearInterval(downint);
    }

  6. SetInterval is used to call a function after a certain period of time until it is cleared using the ClearInterval.
  7. Thus they help in creating scrollers that can scroll until the mouse is released as shown below.
  8. Save your work and test the Movie (Ctrl + Enter). That's it you have learnt how to create simple scrollers for textboxes in Flash using Actionscript.


Advanced Scrollbars using Mouse Press and Mouse Over Actions

Note: This is also applicable to Input text type. The rollOver and rollOut events of a Buttons can also be used to enable scrolling during mouseover events as shown above in the second swf.

We would love to hear your comments and any suggestions on future tutorials we can add to this section. Thanks!

Fill the below form to submit your comments (or suggestions):
Bookmark and Share this web page.
Sponsored Link(s):
Beauty Templates | Business Templates | Christian Templates | CSS Templates | Education Templates | Family Templates | Flash Templates | Free Dreamweaver Templates
Food Templates | General Templates | Government Templates | Health/Medical Templates | Hi-Tech Templates | Kids/Childcare Templates | Low-cost Budget Templates
Personal Templates | Pets Templates | Photography Templates | Profession Templates | Real Estate Templates | Sports Templates | Telecom Templates | Travel Templates
Free Tutorials > Web Design Tutorials | CSS Web Design | Fireworks Tutorials | Dreamweaver Tutorials | Flash Tutorials | SEO Tutorials | Javascript Tutorials | PHP Tutorials