Short story about being obsessed with a girl.
"Have you ever been obsessed about any human being? Have you ever felt satisfied about your obsession? Have you been dreaming about her?..."
Read full story published in my new blog.
CryptoFables
<!Doctype HTML>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
/*works when page loading complete, this is important
because you want your divs' match height from the beginning.*/
$(document).ready(function(){
//alert("ready");
changeDivHeight();
});
/*whenever browser window size changes, this function is being called
and it fixed div height.*/
$(window).resize(function(){
//alert("resize");
changeDivHeight();
});
/*here we place our logic
we take each sizes, compares which one is largest and then
set other's height.*/
function changeDivHeight() {
// .innerHeight() returns height of an element
var a = $("#div_a").innerHeight();
var b = $("#div_b").innerHeight();
//alert(a + " " + b);
// .height() sets height of an element
// we can pass an integer value, which will be converted into px
// otherwise we can pass a string, mentioning the unit such as px or in or cm or dp
if( a > b ) {
$("#div_b").height( a );
} else {
$("#div_a").height( b );
}
}
</script>
</head>
<body width="75%" align="center">
<div id="div_a" style="border: 1px solid red; float: left; width: 30%;">
<p>hello div A hello div A hello div A hello div A hello div A hello div A.<br>div A has large height. Will div B be able to achieve same height??</p>
</div>
<div id="div_b" style="border: 1px solid green; float: left; width: 30%">
<p>hello div B<p/>
</div>
</body>
</html>