First mobile front-end open source project-dailog

Source: Internet
Author: User
Tags api manual

In the front end of the mix for so long, has been in demand, never give. So determined to do a self-open source project, with their own meager strength, to promote the domestic open source environment to make a little contribution. This idea has been in the mind for a long time, but has been busy living, no time and energy to do this. Today just a little time, so on the Coding.net published, by the way to write a hydrology, hoping to win some applause. Saliva to this end, the following into the topic.

Development background:

On the phone, most of the time, the data load is asynchronous, in order to give users some hints on the page, need to have a busy cursor to fade this boring for a few seconds. If you are working directly with a spinning gif, although simple and effective, there is no compatibility issue, but there are the following drawbacks:

1: Different resolutions are true, there may be jagged edges, or blurred icons.

2: For a small icon, to generate an HTTP request. In the case of poor speed, the time of the HTTP request is much greater than the time it took to download the icon.

3: To change the text on the icon, or to change the style of the icon, you need to re-create, and then upload the cover, very inconvenient.

This is not acceptable for the pursuit of the perfect program.

On the PC we use a alert pop up some warning message, this is very common, but to the mobile phone, will be unrequited to add some of the address bar file information, and the interface will vary depending on the browser.

I have the same problem with confirm, and it's not what I want to look like.

Sometimes, we need to display the name of the button, not necessarily called "OK" and "Cancel", or change the color of their own, these are no way to achieve. Also, I want to implement a prompt from the middle of the box, automatically disappear after 3 seconds, and I want a line of text from the bottom slowly rise, and then slowly fall, there are ...

Build your own wheels.

Human desires are endless, and the system provides a UI that never satisfies a greedy human being. Thus, only we build the wheels ourselves to meet the most personalized needs. Similar UI components, on the Gihub is also a search a lot of, including some of the famous, such as Juqeryui, although powerful, but sometimes, I just need a small dialog box, I have to introduce so many files?

For all the above reasons, I started my own and bounced the code on my keyboard.

, on the left is the effect of Google Chrome, and on the right is the effect that my component provides by default. For more results, please move to my git ad: https://git.coding.net/is a good code repository, faster than Git, supports demos, pays for private silos.

According to the company's requirements, I used jsdoc simple to do an API manual, the drawing is as follows:

It looks like it's smarty pants. In order to facilitate other users to customize the function, imitation videojs, third-party users can directly change the Youa API, you can also pass the new function to rewrite. For those who do not want to move the lazy, you can directly replace the default style files, to achieve skin change, presumably this is also excellent.

After all this, under Node Gulp build, you can package the release. If you don't have a node environment, it doesn't gulp, and it doesn't matter, just use the way you cooked it. My design principle is to try not to rely on third-party libraries, and try not to increase the cost of learning. Of course, if you love learning, love toss, I also like.

Project Preview

Large section of the code is not affixed, directly on the git:https://git.coding.net/ouyangli/dailog.git welcome everyone fork, mention issue.

I think I can do a lot of things, I hope you have more encouragement, together to learn JS.

Temporary Demo Address: http://dailog-3e6f3.coding.io/

First mobile front-end open source project-dailog

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.