News on the Internet

The controllable rolling news is different from the automatic scroll bar. It uses buttons to control the movement. When you place the mouse over the button, the news content will scroll up or down. We can. It should be noted that at the beginning of production, you must be sure that you have downloaded and used the "timeline extension", which allows us to implement reverse layer movement.

Procedure:

1. First, we need to build a page framework to define the location of the layer. These are done through the organization of the table, which is not described in detail here. After the framework is organized, place the cursor in the table, select Insert-Layer to Insert a Layer, select the Layer, and specify its width and height in the attribute panel, finally, specify the values of the L, T, R, and B items in Clip (note: L represents the distance between the layer and the left side of the page, T represents the distance between the layer and the top of the page, R represents the distance between the layer and the right of the page, and B represents the distance between the layer and the bottom of the page .). Since we did not move any movement when nesting layers in the table, this indicates that the layer is absolutely positioned. Therefore, the values of L and T are 0, the R and B values are specified as the layer width and height.

2. place the cursor in layer 1 and select "Insert-layer" again to Insert a new layer, that is, layer 2. This layer is the child layer of layer 1, and its width value is the same as that of layer 1, the height value is random and can be based on the length of the text to be inserted.

3. Enter the required text in Layer 2.

4. Right-click layer 2 and select "Add timeline" in the pop-up list. This layer will be automatically added to the timeline. The default number of frames is 15.

5. Select layer 2 in frame 15th and change the T project value in the attribute panel. This value can be customized, but in most cases it is based on the layer height. That is to say, if the number of layers is high, a negative number is entered in the T Project. In this example, the height of 2 in the middle layer is 196, and the value of T project is-196.

Note: a negative value indicates that the layer moves up, and a positive value indicates that the layer moves down.

6. Select an image to move down. First, specify an empty connection for it in the Link project of the property panel, or enter. Open the Behaviors panel, press "+", and select "Timeline-paly timeline" in the behavior list ". In this case, DW automatically displays a dialog box named "Play timeline", where "Timeline1" is selected ".

7. return to the action panel and we will see an action item. Select this action and a downward triangle appears in the middle. Click it, in the displayed action list, select Onclick ". See figure 6.

8. Select an image to scroll up. After an empty connection is added, specify the Play Timeline Reverse action in the timeline option in the action list. Similarly, according to Step 7, specify the mouse action generated on this image as Onclick, which means that when we click this image, the timeline will move in reverse.

9. All finished! Press F12 to see the effect!

Tips:

You may hate the scroll bar on the right of the browser to scroll up and down as the layer moves! Now let us know a solution: switch to the code editing status and write the following code in the tag: style = your overflow-Y: hidden success 〃, this code can block the y axis scroll bar. The method for shielding the X-axis scroll bar is the same as that for: style = fill overflow-X: hidden trim 〃. However, this only applies to pages with a page height of 100%. If your page is long, you do not need to use it.</