• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

190
Views
How to change height and width of an iframe?

I got this code for a bookmarklet from another website (dublins) but I wanted to modify it and change the height and width to 100% of the page. I would do it myself, but I don't know how to use javascript. Thanks!

javascript:var url = prompt('What site do you want to embed into '+__uv.$get(location).href+'?%27);var%20prefix%20=%20%27https://%27;%20if%20(url.substr(0,%20prefix.length)%20!==%20prefix)%20{%20url%20=%20prefix%20+%20url;%20}%20var%20ifra=document.createElement(%27iframe%27);ifra.src=url;ifra.setAttribute(%27height%27,%27770%27);ifra.setAttribute(%27width%27,%271365%27);void(document.body.appendChild(ifra));
about 3 years ago · Juan Pablo Isaza
2 answers
Answer question

0

The size of new iframe is set by this.

ifra.setAttribute(%27height%27,%27770%27);ifra.setAttribute(%27width%27,%271365%27);

Decoding into normal JavaScript yields the following

ifra.setAttribute('height','770');
ifra.setAttribute('width','1365');

Here, the width and height are set with attributes, but attributes cannot specify a size based on the page size. Therefore, use CSS as follows.

ifra.style.height='100vh';
ifra.style.width='100vw';

Now all we need to do is put this back in the bookmarklet. Replace the first part with the following.

ifra.style.height=%27100vh%27;ifra.style.width=%27100vw%27;

So, the complete bookmarklet is following.

javascript:var url = prompt('What site do you want to embed into '+__uv.$get(location).href+'?%27);var%20prefix%20=%20%27https://%27;%20if%20(url.substr(0,%20prefix.length)%20!==%20prefix)%20{%20url%20=%20prefix%20+%20url;%20}%20var%20ifra=document.createElement(%27iframe%27);ifra.src=url;ifra.style.height=%27100vh%27;ifra.style.width=%27100vw%27;void(document.body.appendChild(ifra));

But sorry that I have not tested it because your bookmarklet didn't work on my end.

about 3 years ago · Juan Pablo Isaza Report

0

<iframe style="width: 100px; height: 100px; background: red"></iframe>

about 3 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error