Interface display of the new version of Timeline

[Introduction] 1. Function introduction: Click the Timeline Button on the business interface to enter the main page of Timeline; the main page integrates the technical framework of TimeElapsed, and introduces Timeline’s infobox for interface display, enriching the page effect and replacing it with HTML The implementation method of the original Silverlight has been replaced. The main page of The colors represent different event types. Click More to display more detailed information. Click Link to link to the Summary page of the corresponding Event. If the event is covered, you can drag it up and down to view it. The program loading process will automatically initialize the appropriate Infobox. Location.

2. Design and implementation: The entire page is implemented in pure HTML. The algorithm for dragging and scaling the main body and the calculation of position are all independently developed. Dialog is the Dialog of jQuery UI, the tool in the upper right corner. Bar is Ext's Toolbar; Silder is also implemented using jQuery UI's Draggable and Resizable.

3. Dialog design concept: Implemented in the pop-up Dialog, eliminating the need to deal with the connection with the main page, and also eliminating the problem of the scroll bar [The page wheel event conflicts with the Timeline wheel zoom ] to facilitate integration with other projects.

The above is the detailed content of Interface display of the new version of Timeline. For more information, please follow other related articles on the PHP Chinese website!