javascript - Using qTip in Chrome Extension to show annotation -


I am creating a Chrome extension to explain text on any website. So far it takes input into an original Javascript prompt window and displays it in a warning box on .onmouseover . However, I want to employ the use of the qTip2 jQuery plugin instead of using the alert box. <{P>

  "content_scripts": [{"matches": ["http: // * / *", "https: // * / *"], "js": ["Content.js", "jquery-1.3.2.min.js", "jquery.qtip.min.js"], "run_at": "document_start", "all_frames": true}],  

Here is the snippet that takes annotation and displays it:

  function forward () {var span = document createElement ("time"); Span.style.backgroundColor = "yellow"; // Enter the annotation in the prompt box var text = prompt (Enter the annotation below: "); // Mouseover shows annotated text on the span. Onmausover = function () {warning (text);} if (document. GetSelection ()) {var sel = document.getSelection (); if (sel.rangeCount) {var category = sel.getRangeAt (0) .cloneRange (); range.surroundContents (period); sel.removeAllRanges (); sel AddRange (Range);}}}  

I have seen examples of qTip2 in some functioning, and they all have the following HTML attributes such as class or ID Do not work in:

  $ (document) .ready (function () {// content div $ ('# content a [href]') All links with href attributes Elements to match. Qtip ({some basic material tooltip for {content: // give it some content, a simple string in this case}}}};  

My question is How do I get qTip to work on my comment?

Since your span Object is a DOM element, so you probably Only

  $ (span) .qtip ({"key1": value1, "key2": value2, ... "keyN": valueN});  

after range.surroundContents (span); Instead of .onmouseover line, your jQuery and qTip2 references are already valid.

You can pass DOM elements in jQuery to get a jQuery object for that element. The QTip sample simply wants a valid jQuery object to plug in.

  • Get a jQuery object for it,
  • and pass it on qTip.

  • Comments

    Popular posts from this blog

    import - Python ImportError: No module named wmi -

    Editing Python Class in Shell and SQLAlchemy -

    c# - MySQL Parameterized Select Query joining tables issue -