I am trying to make a simple Safari 5 Extension that just injects a custom javascript. Any ideas how can I make use of jQuery in this custom script, please? I only know it's possible, because it is mentioned on one of WWDC videos, but I don't know how to do it.
Thanks
You can include jquery.js as a "start script". Your regular script (as an "end script") will see it.
I believe that if you don't need to keep jQuery updated, just copying the source code of jQuery into your extension's code base should work.
Related
I was looking into making Firefox addons, and I need some help.
Is it possible to edit an HTML page that is open in the browser with javascript?
For example:
User types in "google.com"
Addon is activated
Javascript changes contents of "google.com" to maybe say "Hello!" at the bottom.
Of course this isn't specifically what I want to do, but a push in the right direction on how to accomplish such a task would be great.
~Carpetfizz
From within a Firefox addon this is obviously possible as many extensions do this.
If you, however, simply want to modify the DOM and nothing else than I would recommend taking a look at greasemonkey. Loads of example scripts around to do this: http://userscripts.org/
And the added benefit, if written correctly they also work in Chrome and other browsers.
Yes, it is. You must find a tutorial about javascript DOM manipulation
I've got a problem in good old IE7, as one of my clients is still using it.
For some reason, fancybox doesn't open and just throws a JS error in the jquery file itself.
I've tried debugging it, but have not found the solution as of yet.
Can you guys help me out here?
The site is http://beta.baeckerei-glasenapp.de/filialen/ and, as you can see in other browsers, the fancybox should open once you click on one of the 9 elements.
BTW: The HTML is generated by my CMS, so please excuse the "dl>a", which is nit valid HTML5 AFAIK.
Thanks
Tobias Timpe
There is a new version, which may solve the issues you are struggling with:
http://fancyapps.com/fancybox/
Is there any tool or addon which can be used for testing or identifying Javascript functions in real time (i.e. on click or some events )..
e.g. on a website, I want to know after clicking on a link, which all JS functions are being called/executed..I know sometimes it is stragightforward from the code, but in case it uses JS libraries like jQuery, the actual function call is made from otside..
How can I do that?
*I'll really appreciate if, alongwith the addon, you just write a short description as to where can I find the Javascript finction tracking in that **
Thank you.
Try Firebug. It's one of the most useful firefox addons. Grab it here:
http://getfirebug.com/
Dragonfly (Opera), or Firebug extension for Firefox, or any other good javascript debugger
See Visual Event. It is a bookmarklet that overlays element event handler information.
FireQuery is available as a firefox plugin which adds handler information inside of firebug.
Firebug includes a JavaScript profiler. Give it a try.
http://getfirebug.com/javascript
In Chrome, right click the page and choose Inspect element, go to the console, start javascripting! Choose the scripts tag to get debugger functionality.
Is there a plugin for jQuery or generally a method to have a textarea containing CSS code of the currently open web page which will be automatically updated during edit (without page reload)?
It's not exactly a general solution you're asking for, so just throwing this out there in case it's what you're ultimately after. If your goal is to edit and play with your styles there's Firebug, or Chrome's built-in developer tools.
The JavaScript version is Firebug Lite.
Thank you guys – most of all thanks to takeshin (who posted a comment to my original question).
takeshin's comment helped me quite a bit: With jQuery, I inserted the edited CSS code from a code highlighter called Codemirror into the head of the page. It's as simple as that. :)
There are now several services out there. I personally use codr.io. For not-quite real-time I use jsfiddle.net.
With javascript event timers, you can relatively easily determine how long it too for the page to render in the browser, especially when using tools like Jiffy. However, is it possible to capture more granular events such as individual image/object download times using javascript in the page? I am fairly sure this is not possible, but wanted to confirm with the javascript guru's of SO.
Thank you in advance.
Sadly, unless you load the images using the javascript image object manually instead of in the markup, I don't believe this is possible. that's why you usually see this functionality in things like firefox plugins
You could look at the Net tab in Firebug. I don't know if it can give you same information via Firebug Lite in other browsers or not.
If what you want to time can be put into an event that has a callback, you can check the time before and after. So anything you do with Ajax you can time. What exactly are you trying to time? Can you be more specific?
I'm not totally familiar with this jQuery plugin, but it may be of help to you:
http://plugins.jquery.com/project/timers