Open

HTML iframe - Mini-browsers

I have a website which already allows users to upload images on the canvas

The website was coded using HTML with some JS libraries like CanvasJS

We are looking to add a few more features to the site:

1. A + button to let users add a draggable and resizeable iframe (a mini browser that allows users to type the URL and browse web)

please check the following fiddle as a reference example. however it cannot be dragged or resized or rotated.

[login to view URL]

The example of mini-browser.

But this should be draggable and resizeable across the canvas

2. Since the iframe mini-browser will render the URL site inside. the mini-browser should have a zoom in-out button to enable users to zoom in and out (with scrollbar enabled).

If the users resize the main browser window, the position of the mini-browsers should NOT change (ABSOLUTE positioning)

************************

Key Deliverables:

Milestone :

1. 50% Pay-out:

- HTML page with a button to add mini-browsers

- The mini-browsers will be added in the middle of the page

- The mini-browsers should be draggable, resizeable, (and rotateable, if you are using CanvasJS)

The top bar should have fixed size after resizing the mini-browsers

2. Remaining 50% Pay-out:

- Similar CSS design and layout of the mini-browser as per the fiddle (code given) [Back/Forward, URL box, Refresh)

- The zoom in/out buttons in each mini-browser (with scrollbar enabled if the users zoom in)

Can be placed at the bottom right of each mini-browser or as deem fit

- The absolute positioning of each mini-browser if the users resize the web browsers

Skills: Javascript, CSS, HTML, jQuery / Prototype, HTML5

See more: adjust html data different browsers, html code mini website, html iframe auto size, iframe refused to connect, iframe srcdoc, how to add text in iframe in html, iframe html code, embed website html without iframe, html iframe full page, iframe video, iframe html, html iframe injection, php script previous next html iframe, html iframe autoheight, html iframe flash, html iframe auto resize height content, html iframe php, html basic mini project samples, html iframe change source php, html code mini pages

About the Employer:
( 0 reviews ) Bangkok, Thailand

Project ID: #24546484

4 freelancers are bidding on average $41 for this job

sachinchhabra01

Hi There, I am highly skilled in HTML, CSS, and Javascript. I have over five years of experience with each of these technologies, and I am eager to learn even more technologies to sharpen my skillset. I also have kno More

$60 USD in 3 days
(7 Reviews)
3.8
AJGRAPHIC96

Hello Greetings....!! I have a team of experience developers and a long list of satisfied clients...offering you very cheap rate with sure result...so please give us a chance to start our business relation. we do hav More

$50 USD in 4 days
(1 Review)
0.8
$25 USD in 1 day
(0 Reviews)
0.0
gracereshma11

This is to express my interest in the job posted by you for a, detailed-oriented, website designer. As you'll see, I have one year of hands-on experience efficiently coding websites and applications using modern HTML, More

$30 USD in 3 days
(0 Reviews)
0.0