Eray
Eray

Reputation: 7128

Creating a bookmarklet

(Question improved)

Hello, I'm trying to make a bookmarklet. Bookmarklet will be overlayed and will open right-top corner of page . You can see bookmarklet types [here][1] i want to make overlay interface.

Here is my javascript code for bookmarklet :

javascript:void((function(){var%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('src','http://www.girmiyor.co.cc/bookmarklet.js');document.body.appendChild(e)})())

Bookmarklet will call bookmarklet.js file. Content of bookmarklet.js :

document.body.innerHTML += "<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js'></script>";

document.body.innerHTML += "<div class='result' style='background-color:grey;z-index:1000;position:absolute;right:0;top:0' width='300' height='250'></div>";



var site = location.href;

    $.get("http://www.girmiyor.co.cc/c.php",{ q: site}, function(data){
                        $('.result').html(data);
                });

GET request sending i can see it via Firebug. But nothing returned.

Can you help me?

Upvotes: 0

Views: 3665

Answers (3)

fruight
fruight

Reputation: 108

Take a closer look at the friendfeed bookmarklet you mentioned; all it does is create and append a new script tag that holds a js file with the 'real' functions. The article you mentioned does the same. The basic (pretty selfexplaining) method is:

e=document.createElement('script');
e.type='text/javascript';
e.src='http://domain.tld/file.js'; //optionally pass GET params
document.getElementsByTagName('head')[0].appendChild(e); //optionally, you could append to the <body>

if you then take a closer look at the files that are included by this method you can see how the overlay is constructed. I pasted the important snippet from the friendfeed file, where the overlay div gets positioned, look for that section and study it:

// Create the share dialog in the corner of the window
var container = div();
container.id = "ff__container";
container.style.position = "absolute";
container.style.top = scrollPos().y + "px";
container.style.right = "0";
container.style.width = "auto";
container.style.zIndex = 100000;

so i would suggest that you make a separate js file that holds the functions for constructing the overlay and you let your bookmarklet load that file.

Upvotes: 2

Miguel Ventura
Miguel Ventura

Reputation: 10458

The current version of your bookmarklet.js is broken (as I'm writing this answer) because there's a missing quote after var data =.

Appart from that, I have several untested theories regarding your problem:

  1. You're replacing the body's innerHTML where your own script is running. And by the time the script finishes, jQuery isn't even loaded yet. You probably have to suspend the script's execution and wait for jQuery to load. Try something like putting your $.get() in a function that's called after a window.setTimeout(), and preferably that checks for the existence of $ (with typeof($) != 'undefined') and either waits more or runs your $.get().
  2. You're loading jQuery through HTTPS, so browser policies may prevent $.get from getting stuff from HTTP
  3. Setting the jQuery <script> reference's type attribute to text/javascript shouldn't be your problem, but it definitely wouldn't hurt doing.

Upvotes: 0

poke
poke

Reputation: 387507

when i add this code directly firefox's bookmarks and then click return a page and [object XMLHttpRequest]

This is a common problem with bookmarklets. To fix that add a void(0); to the end of the bookmarklet code. That way, the bookmarklet won't return any value which would be displayed in the browser.

Upvotes: 1

Related Questions