That wouldn't help here. Rain Lover wants a scrollbar.
BTW, I was playing around some more and found that IE 7 and less can work with this quite well if we add the highlighted:
Code:
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
#pics {display:inline-block; height:200px; overflow-x:hidden; overflow-y:auto;}
a {display:block;}
img {border:0;}
</style>
<!--[if lt IE 8]>
<style type="text/css">
img {margin-bottom: 0.25em;}
</style>
<script type="text/javascript">
document.onreadystatechange = function(){
var div = document.createElement('div'), w1 = pics.all.tags('img')[0].width, w2;
pics.style.width = w1;
pics.appendChild(div);
w2 = div.offsetWidth;
pics.style.width = w1 * 2 - w2;
pics.removeChild(div);
};
</script>
<![endif]-->
<script type="text/javascript">
var divWidth = {
addEvent: (function(){return window.addEventListener && !window.attachEvent && !window.opera? function(el, ev, f){
el.addEventListener(ev, f, false);
}:function(){return;};
})(),
setWidth: function(){
divWidth.pdiv.style.width = divWidth.im.width * 2 - divWidth.inner.offsetWidth + 'px';
},
init: function(){
var dw = this;
dw.addEvent(window, 'DOMContentLoaded', function(){
dw.pdiv = document.getElementById('pics');
dw.im = dw.pdiv.getElementsByTagName('img')[0];
dw.pdiv.appendChild(dw.inner = document.createElement('div'));
dw.addEvent(dw.im, 'load', dw.setWidth);
});
}
};
divWidth.init();
</script>
</head>
<body>
<div id="pics">
<a href="#"><img src="http://dl.dropbox.com/u/4017788/Labs/thumb1.jpg" alt=""></a>
<a href="#"><img src="http://dl.dropbox.com/u/4017788/Labs/thumb1.jpg" alt=""></a>
<a href="#"><img src="http://dl.dropbox.com/u/4017788/Labs/thumb1.jpg" alt=""></a>
<a href="#"><img src="http://dl.dropbox.com/u/4017788/Labs/thumb1.jpg" alt=""></a>
<a href="#"><img src="http://dl.dropbox.com/u/4017788/Labs/thumb1.jpg" alt=""></a>
</div>
</body>
</html>
And people wonder why Microsoft was reluctant to adopt standard methods when it already had a much more concise language for these sorts of things.
But that's ancient history now. Funny thing though, jQuery and this older style of coding from Microsoft remind me of each other in that they're both more succinct than standard javascript. However, since with jscript (MS proprietary code), the 'shorthand' functions are all native code, they not only take less time to write, they execute faster as well.
Regular Coders
Posting Permissions
Reply With Quote
Bookmarks