Mousewheel for Resize Image (a little tip)
Demo (http://demos111.mootools.net/MousewheelCustom)
In Subs.php
Find:
'content' => '<img src="$1" alt="" border="0" />',
Change:
'content' => '<img id="hcm1" src="$1" alt="" border="0" />',
In index.tempalte.php
Find:
</head>
<script language="JavaScript" type="text/javascript" src="', $settings['theme_url'], '/mootools.js"></script>
<script type="text/javascript">
window.addEvent("domready", function(){
Element.Events.extend({
"wheelup": {
type: Element.Events.mousewheel.type,
map: function(event){
event = new Event(event);
if (event.wheel >= 0) this.fireEvent("wheelup", event)
}
},
"wheeldown": {
type: Element.Events.mousewheel.type,
map: function(event){
event = new Event(event);
if (event.wheel <= 0) this.fireEvent("wheeldown", event)
}
}
});
/* Mousewheel by Hoochie Coochie Man */
$("hcm1").addEvents({
"wheelup": function(e) {
e = new Event(e).stop();
this.width *= 1.1;
this.height *= 1.1;
},
"wheeldown": function(e) {
e = new Event(e).stop();
if (this.width-30 >= 30) {
this.width /= 1.1;
this.height /= 1.1;
}
}
});
});
</script>
And finaly put the attached .js file to your theme file.
Looks good. Quite a bit of code though, will it slow down pages with quite a few images?
/me moves to Tips and Tricks :)
mootools is AFAIK a whole framework. Perhaps the needed function(s) could be separated?
haha nice trick yr...
nice. :D
nice Tips and Tricks :)
Thank