Reprinted please indicate the source: http://blog.csdn.net/horkychen
360 the browser team did a good job by translating the chorme development document into Chinese. Click here.
Based on this example, I made a two-dimensional bar code plug-in. By default, the current webpage address is converted into a two-dimensional bar code.
(* Using the UC browser, you can easily input two-dimensional codes .)
File directory:
Three Icon files: 16.png, 48.png, 128.png
One mainfest. JSON-> plug-in information file
One pop webpage file: index.html
{"Name": "2D barcode", "version": "1.0", "Description": "barcode generator. "," Icons ": {" 16 ":" 16.png", "48": "48.png"," 128 ":" 128.png"}, "browser_action": {"default_icon ": "16.png"," default_title ":" bar code generator "," popup ":" index.html "}," Permissions ": [" tabs "]," homepage_url ":" http://blog.csdn.net/horkychen "}
The two-dimensional barcode is generated using the TEC-It barcode generator. By default, Chrome Content scripts is used to obtain the current webpage address and generate a bar code. You can also enter a bar code in the editing box. The effect is as follows:
Use "load development extension" in Development ModeProgram"To facilitate modification and debugging:
Webpage focus:
1. Obtain the current webpage address through chrome. Tabs. getselected by default and generate the initial barcode.
2. Specify the onclick event on the button and generate a bar code based on the content of the text box.
The complete package is here
For the convenience of friends who are too lazy to go to the entire package, put the big picture and HTML here:
128. PNG
48. PNG
16. PNG
Index.html content:
<HTML> <title> 2D barcode generator </title> <body> <div> <input type = "text" id = "url"> <input type = "button" Value = "generate >>>" onclick = "changebarcode () "> <br/> </div> <Table> <tr> <TD> </TD> </tr> </table> <SCRIPT type = "text/JavaScript"> var tablink; chrome. tabs. getselected (null, function (Tab) {tablink = tab. URL; document. getelementbyid ("url "). value = tablink; document. getelementbyid ("url "). focus (); changeb Arcode () ;}); function changebarcode () {var text = document. getelementbyid ("url "). value; If (0 = text. length) {text = "http://blog.csdn.net/horkychen";} var newpicurl = "http://barcode.tec-it.com/barcode.ashx? Code = qrcode & modulewidth = 6 & unit = px & Data = "+ TEXT +" & DPI = 120 & imagetype = PNG & rotation = 0 & color = & bgcolor = & fontcolor = & quiet = 0 & qunit = mm & eclevel = "; document. getelementbyid ("barcode_img "). src = newpicurl; }</SCRIPT> </body>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
