How do you remove the scrollbars on timeline.js iframe?

Question

I tried posting this to the timeline.js Google group but it got deleted.

I'm seeing scrollbars on the outer iFrame on the plugin's website (http://timeline.verite.co) and on our test site.

When embedding the iframe into our site I tried adding:

<iframe scrolling="no" style="overflow:visible;"

But while the scrollbars disappear, the right edge gets cut off slightly.

Also, the suggested embed code has width="100%".

• If I reduce this to 95%
• The iframe is much smaller than the containing div
• but the right edge still gets cut off slightly
• We see this in Firefox, Chrome and Safari on Mac
• We also see the scrollbars in our preview on the timeline.js website

I'm sure I'm missing something simple but can't see anything on the timeline.js site or in the Google Group - except a few "you're doing it wrong" comments for other posts.

Is there a trick to removing scrollbars in iFrames? Sorry if this is simple.

Cheers

Ben

Answer 1

Add width, height and frameborder in your iframe as shown below

width='100%' height='700' frameborder='0'

Try this, i think now it's works

<iframe src='embed.verite.co/timeline/?source=0Aj2TitNEGaD2dHlqV3ZRcDhMYlY3MjZmUEt2aWQ0ckE&font=Bevan-PotanoSans&maptype=toner&lang=en' width='100%' height='100%' frameborder='0'></iframe>