HI,
i am trying to build a bookmarklet using jQuery to display a form in
an overlay. The overlay displays displays correctly if I execute the
code from a file. But once i move it to the href of a link, it returns
a blank page with the javascript in the url and [object Object] in the
body of the page. I am using load() function to load the html and css
required.
I am fairly new to jQuery and this is my first app. in jQuery. I dont
know what i'am doing wrong.
please help.
The following is the code.
<body>
<a href="javascript:
var s=document.createElement('script');
s.setAttribute('src','jquery.js');
document.getElementsByTagName('head')[0].appendChild(s);
alert('1');
var tv = $('head').load('testcss.html');
var tt = $('body').load('test.html');
var popupStatus = 0;
function loadPopup(){
if(popupStatus==0){
$('#backgroundPopup').css({
'opacity': '0.7'
});
$('#backgroundPopup').fadeIn('slow');
$('#popup').fadeIn('slow');
popupStatus = 1;
}
}
function centerPopup(){
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
var popupHeight = $('#popup').height();
var popupWidth = $('#popup').width();
$('#popup').css({
'position': 'absolute',
'top': windowHeight/2-popupHeight/2,
'left': windowWidth/2-popupWidth/2
});
$('#backgroundPopup').css({
'height': windowHeight
});
}
function disablePopup(){
if(popupStatus==1){
$('#backgroundPopup').fadeOut('slow');
$('#popup').fadeOut('slow');
popupStatus = 0;
}
}
var tabContainers = $('div.tabs > div');
tabContainers.hide().filter('form').show();
$('div.tabs ul.tabNavigation a').click(function(){
tabContainers.hide();
tabContainers.filter(this.hash).show();
$('div.tabs ul.tabNavigation
a').removeClass('selected');
$(this.hash).addClass('selected');
return false;
}).filter(':first').click();
$(document).ready(function(){
centerPopup();
loadPopup();
});
">
Bookmarklet me
</a>
<p>I am a P tag</p>
</body>
