I have two divs of fixed length as of now, which loads external URL by dynamically embedding iframes inside them. Divs are appearing next
to each other - one on left and other right.
As of now, I have fixed their width
to 50% each. But, I want
to give user a flexibility
to increase the width of any div
to view the URL inside easily without scrolling horizontally. Something like dragging the border separating the two divs
to either left or right according
to his need.
Is there a way I could achieve this? Please suggest any library or something.
I have gone through a library twentytwenty which is used for images. I don't know how will that work for dynamic iframes.
Here is the JSFiddle which displays the divs.
<div>
<div id="originalPage" style="width:54%;height: 730px;float:left">
<p>one div </p>
</div>
<div id="diffReport" style="width:45%; height: 730px;float:right">
<p>another div</p>
</div>
</div>
