Search code examples
javascripthtmlcssiframeposition

Can't position iFrame properly in Javascript bookmarklet


I've been making a Javascript bookmarklet that embeds an iFrame and I cannot align the iFrame correctly

I have tried each of the alignment types and different ways of positioning, with no luck

var AppendedFrame = document.createElement("iFrame"); 
    AppendedFrame.src="https://www.google.com";
    AppendedFrame.setAttribute("position", "absolute");
    AppendedFrame.setAttribute("width", "400"); 
    AppendedFrame.setAttribute("height", "225"); 
    AppendedFrame.setAttribute("top", "2px");
    AppendedFrame.setAttribute("right", "3px"); 
    AppendedFrame.setAttribute("z-index", "2147483648"); 
document.body.appendChild(AppendedFrame);

The output I expected was to have an iFrame appear in the top right and stay, however the iFrame just stays in it's default spot.

Edit: Google is just an example by the way, I will be using a different website when it's done.


Solution

  • var AppendedFrame = document.createElement("iFrame"); 
    AppendedFrame.src="https://www.baid.com";
    AppendedFrame.setAttribute("style",'"position":"absolute";"width":"400";"height":"225";"top":"2px";"right":"3px";"z-index":"2147483648"');
    document.body.appendChild(AppendedFrame);