How to change tag values with Greasemonkey

Question

I have this wonderful iFrame that has wonkey dimensions that I want to change to something useful on load.

<iframe id="iWork" width="640px" height="530px" />

I've tried googling around and found that the following should work, but it does not seem to do anything:

var query = document.querySelector("#iWork");
if (query) {
    query.setAttribute("width", "1000");
    query.setAttribute("height", "1000");
}

... but it doesn't change anything :-/

Any pointers on what I am doing wrong would be awesome.

Answer 1

your code works fine for me.

you can test it here:

• with GM: http://banrilab.dyndns.org/
• without GM: http://jsfiddle.net/sVG4E/

the GM script

// ==UserScript==
// @name           TEST
// @namespace      TEST
// @description    TEST
// @include        http*://banrilab.dyndns.*
// ==/UserScript==

var query = document.querySelector("#iWork");
if (query) {
    window.setTimeout(function(){
        query.setAttribute("width", "500");
        query.setAttribute("height", "500");
    }, 3000)
}

i just added a timeout so you can see the size change after 3 seconds