JSFiddle - React, Tailwind, and code Playground

by mustafa yılmaz

HTML

<body topmargin="0" leftmargin="0">
    <div class="kutu">
<a href="javascript:;" onclick="showMe('gizlebeni');">Göster</a> 
<a href="javascript:;" onclick="hideMe('gizlebeni');">Gizle</a>

    </div>
    <div id="gizlebeni">
        <iframe width="100%" height="100%" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=tr&amp;geocode=&amp;q=samsun+web+tasar%C4%B1m&amp;aq=&amp;sll=37.0625,-95.677068&amp;sspn=36.042042,86.572266&amp;ie=UTF8&amp;hq=web+tasar%C4%B1m&amp;hnear=Samsun,+T%C3%BCrkiye&amp;ll=41.287174,36.330317&amp;spn=0.066797,0.169086&amp;t=m&amp;z=13&amp;iwloc=A&amp;cid=14361799457348483525&amp;output=embed"></iframe>
        <br /><small><a href="https://maps.google.com/maps?f=q&amp;source=embed&amp;hl=tr&amp;geocode=&amp;q=samsun+web+tasar%C4%B1m&amp;aq=&amp;sll=37.0625,-95.677068&amp;sspn=36.042042,86.572266&amp;ie=UTF8&amp;hq=web+tasar%C4%B1m&amp;hnear=Samsun,+T%C3%BCrkiye&amp;ll=41.287174,36.330317&amp;spn=0.066797,0.169086&amp;t=m&amp;z=13&amp;iwloc=A&amp;cid=14361799457348483525" style="color:#0000FF;text-align:left">Daha Büyük Görüntüle</a></small>

    </div>
</body>

CSS

#buyukDiv {
    width:100%;
    height:100%;
    float:left;
}
.kutu {
    width:150px;
    height:270px;
    background-color:#fff;
    position:absolute;
}

JavaScript

function showMe(blockId) {
    document.getElementById(blockId).style.display = '';
}

function hideMe(blockId) {
    document.getElementById(blockId).style.display = 'none';
}