tag:blogger.com,1999:blog-6553334891573252023Tue, 17 Sep 2024 02:12:45 +0000Comicshttp://ticklecomics.blogspot.com/noreply@blogger.com (Anonymous)Blogger4125tag:blogger.com,1999:blog-6553334891573252023.post-1127154482477176652Sat, 25 Dec 2010 12:04:00 +00002011-02-25T10:24:34.405+08:00Comics<iframe src="https://spreadsheets.google.com/embeddedform?formkey=dDN5cjYwMGpyY1FwQV93WllwVXM0dmc6MQ" width="760" height="619" frameborder="0" marginheight="0" marginwidth="0">Loading...</iframe>http://ticklecomics.blogspot.com/2010/12/contact-me.htmlnoreply@blogger.com (阿龙龙)tag:blogger.com,1999:blog-6553334891573252023.post-2517229474513969878Fri, 05 Nov 2010 07:15:00 +00002010-11-06T23:12:02.645+08:00Click on the post title for more details.<br /> <img alt="Animated Avatar - Bern Lim" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXRmIYToHS0Dsg5P8iIXTDgNDcCXf4FRgowEcWr9EDN44cy2P5vhV4uHdTWx3RNP2DdmpTHXOyBZoupWA6qfnXtlN0NG743mzU6gSLzP3WOapcfnLvmSMyyE7KyTgAXNhGjzSbC7DkrqY/s1600/bern220-search.gif" style="height: 220px; margin-left: 150px; width: 220px;" title="My Animated Avatar." /><br /> <a name='more'></a>Actually, I wanted to do an animated avatar for Facebook Profile, but .gif format was not accepted in Facebook, sigh...!<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"> </script><fb:like href="http://ticklecomics.blogspot.com/2010/11/tee-design-i-love-facebook.html" layout="box_count" ref="top_left" width="520"></fb:like>If you like this design, PLEASE SHARE, SHARING IS LOVE! You can leave any comment on Facebook.<br /> <div class="respond"><h2 style="color: #d7336f;">Post a Comment to Facebook</h2><div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=118978384828178&amp;xfbml=1"> </script><fb:comments width="520"></fb:comments></div><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"> </script><br /> <script type="text/javascript"> /* jQuery Image Magnify script v1.1 * This notice must stay intact for usage * Author: Dynamic Drive at http://www.dynamicdrive.com/ * Visit http://www.dynamicdrive.com/ for full source code * Nov 16th, 09 (v1.1): Adds ability to dynamically apply/reapply magnify effect to an image, plus magnify to a specific width in pixels. */ jQuery.noConflict() jQuery.imageMagnify={ dsettings: { magnifyby: 2, //default increase factor of enlarged image duration: 600, //default duration of animation, in millisec imgopacity: 0.2 //opacify of original image when enlarged image overlays it }, cursorcss: 'url(http://tinyurl.com/klq59k), -moz-zoom-in', //Value for CSS's 'cursor' attribute, added to original image zIndexcounter: 1000, refreshoffsets:function($window, $target, warpshell){ var $offsets=$target.offset() var winattrs={x:$window.scrollLeft(), y:$window.scrollTop(), w:$window.width(), h:$window.height()} warpshell.attrs.x=$offsets.left //update x position of original image relative to page warpshell.attrs.y=$offsets.top warpshell.newattrs.x=winattrs.x+winattrs.w/2-warpshell.newattrs.w/2 warpshell.newattrs.y=winattrs.y+winattrs.h/2-warpshell.newattrs.h/2 if (warpshell.newattrs.x<winattrs.x+5){ //no space to the left? warpshell.newattrs.x=winattrs.x+5 } else if (warpshell.newattrs.x+warpshell.newattrs.w > winattrs.x+winattrs.w){//no space to the right? warpshell.newattrs.x=winattrs.x+5 } if (warpshell.newattrs.y<winattrs.y+5){ //no space at the top? warpshell.newattrs.y=winattrs.y+5 } }, magnify:function($, $target, options){ var setting={} //create blank object to store combined settings var setting=jQuery.extend(setting, this.dsettings, options) var attrs=(options.thumbdimensions)? {w:options.thumbdimensions[0], h:options.thumbdimensions[1]} : {w:$target.outerWidth(), h:$target.outerHeight()} var newattrs={} newattrs.w=(setting.magnifyto)? setting.magnifyto : Math.round(attrs.w*setting.magnifyby) newattrs.h=(setting.magnifyto)? Math.round(attrs.h*newattrs.w/attrs.w) : Math.round(attrs.h*setting.magnifyby) $target.css('cursor', jQuery.imageMagnify.cursorcss) if ($target.data('imgshell')){ $target.data('imgshell').$clone.remove() $target.css({opacity:1}).unbind('click.magnify') } var $clone=$target.clone().css({position:'absolute', left:0, top:0, visibility:'hidden', border:'5px solid white', cursor:'pointer'}).appendTo(document.body) $clone.data('$relatedtarget', $target) //save $target image this enlarged image is associated with $target.data('imgshell', {$clone:$clone, attrs:attrs, newattrs:newattrs}) $target.bind('click.magnify', function(e){ //action when original image is clicked on var $this=$(this).css({opacity:setting.imgopacity}) var imageinfo=$this.data('imgshell') jQuery.imageMagnify.refreshoffsets($(window), $this, imageinfo) //refresh offset positions of original and warped images var $clone=imageinfo.$clone $clone.stop().css({zIndex:++jQuery.imageMagnify.zIndexcounter, left:imageinfo.attrs.x, top:imageinfo.attrs.y, width:imageinfo.attrs.w, height:imageinfo.attrs.h, opacity:0, visibility:'visible'}) .animate({opacity:1, left:imageinfo.newattrs.x, top:imageinfo.newattrs.y, width:imageinfo.newattrs.w, height:imageinfo.newattrs.h}, setting.duration, function(){ //callback function after warping is complete //none added }) //end animate }) //end click $clone.click(function(e){ //action when magnified image is clicked on var $this=$(this) var imageinfo=$this.data('$relatedtarget').data('imgshell') jQuery.imageMagnify.refreshoffsets($(window), $this.data('$relatedtarget'), imageinfo) //refresh offset positions of original and warped images $this.stop().animate({opacity:0, left:imageinfo.attrs.x, top:imageinfo.attrs.y, width:imageinfo.attrs.w, height:imageinfo.attrs.h}, setting.duration, function(){ $this.hide() $this.data('$relatedtarget').css({opacity:1}) //reveal original image }) //end animate }) //end click } }; jQuery.fn.imageMagnify=function(options){ var $=jQuery return this.each(function(){ //return jQuery obj var $imgref=$(this) if (this.tagName!="IMG") return true //skip to next matched element if (parseInt($imgref.css('width'))>0 && parseInt($imgref.css('height'))>0 || options.thumbdimensions){ //if image has explicit width/height attrs defined jQuery.imageMagnify.magnify($, $imgref, options) } else if (this.complete){ //account for IE not firing image.onload jQuery.imageMagnify.magnify($, $imgref, options) } else{ $(this).bind('load', function(){ jQuery.imageMagnify.magnify($, $imgref, options) }) } }) }; jQuery.fn.applyMagnifier=function(options){ //dynamic version of imageMagnify() to apply magnify effect to an image dynamically var $=jQuery return this.each(function(){ //return jQuery obj var $imgref=$(this) if (this.tagName!="IMG") return true //skip to next matched element }) }; //** The following applies the magnify effect to images with class="magnify" and optional "data-magnifyby" and "data-magnifyduration" attrs //** It also looks for links with attr rel="magnify[targetimageid]" and makes them togglers for that image jQuery(document).ready(function($){ var $targets=$('.magnify') $targets.each(function(i){ var $target=$(this) var options={} if ($target.attr('data-magnifyto')) options.magnifyto=parseFloat($target.attr('data-magnifyto')) if ($target.attr('data-magnifyby')) options.magnifyby=parseFloat($target.attr('data-magnifyby')) if ($target.attr('data-magnifyduration')) options.duration=parseInt($target.attr('data-magnifyduration')) $target.imageMagnify(options) }) var $triggers=$('a[rel^="magnify["]') $triggers.each(function(i){ var $trigger=$(this) var targetid=$trigger.attr('rel').match(/\[.+\]/)[0].replace(/[\[\]']/g, '') //parse 'id' from rel='magnify[id]' $trigger.data('magnifyimageid', targetid) $trigger.click(function(e){ $('#'+$(this).data('magnifyimageid')).trigger('click.magnify') e.preventDefault() }) }) }) </script>http://ticklecomics.blogspot.com/2010/11/my-animated-avatar.htmlnoreply@blogger.com (阿龙龙)tag:blogger.com,1999:blog-6553334891573252023.post-5964727341740264227Mon, 01 Nov 2010 15:44:00 +00002010-11-05T15:06:08.577+08:00Click on the post title for details.<br /> <img class="magnify" magnifyby="2" style="width: 260px; height: 419px; margin-left:130px; clear:both;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7FkwLl8_5I1uHUy6FSrV7g16iBEA56QfRTPqjMJQ3ZF2adq7_6OD0IoKacI3K5dVWNxhXSc45zfkneHO7XGStXMn8bILofWuCQ7Fmelmp-SgNfIIcG3lemjJZG-A9CsAfk9sC5Jll4jQ/s1600/iluvFB-tee520.png" alt="I Love Facebook Tee" title="A tee design for Mines Book Fair 2010 project" border="0"/><a name='more'></a><br /> Click on the image to enlarge the design. <script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like ref='top_left' href="http://ticklecomics.blogspot.com/2010/11/tee-design-i-love-facebook.html" layout="box_count" width="520"></fb:like>If you like this design, PLEASE SHARE, SHARING IS LOVE! You can leave any comment on Facebook.<br /> <div class="respond"><h2 style='color:#d7336f'>Post a Comment to Facebook</h2><div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=118978384828178&amp;xfbml=1"> </script><fb:comments width="520"></fb:comments></div><br /> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script><br /> <script type='text/javascript'> /* jQuery Image Magnify script v1.1 * This notice must stay intact for usage * Author: Dynamic Drive at http://www.dynamicdrive.com/ * Visit http://www.dynamicdrive.com/ for full source code * Nov 16th, 09 (v1.1): Adds ability to dynamically apply/reapply magnify effect to an image, plus magnify to a specific width in pixels. */ jQuery.noConflict() jQuery.imageMagnify={ dsettings: { magnifyby: 2, //default increase factor of enlarged image duration: 600, //default duration of animation, in millisec imgopacity: 0.2 //opacify of original image when enlarged image overlays it }, cursorcss: 'url(http://tinyurl.com/klq59k), -moz-zoom-in', //Value for CSS's 'cursor' attribute, added to original image zIndexcounter: 1000, refreshoffsets:function($window, $target, warpshell){ var $offsets=$target.offset() var winattrs={x:$window.scrollLeft(), y:$window.scrollTop(), w:$window.width(), h:$window.height()} warpshell.attrs.x=$offsets.left //update x position of original image relative to page warpshell.attrs.y=$offsets.top warpshell.newattrs.x=winattrs.x+winattrs.w/2-warpshell.newattrs.w/2 warpshell.newattrs.y=winattrs.y+winattrs.h/2-warpshell.newattrs.h/2 if (warpshell.newattrs.x<winattrs.x+5){ //no space to the left? warpshell.newattrs.x=winattrs.x+5 } else if (warpshell.newattrs.x+warpshell.newattrs.w > winattrs.x+winattrs.w){//no space to the right? warpshell.newattrs.x=winattrs.x+5 } if (warpshell.newattrs.y<winattrs.y+5){ //no space at the top? warpshell.newattrs.y=winattrs.y+5 } }, magnify:function($, $target, options){ var setting={} //create blank object to store combined settings var setting=jQuery.extend(setting, this.dsettings, options) var attrs=(options.thumbdimensions)? {w:options.thumbdimensions[0], h:options.thumbdimensions[1]} : {w:$target.outerWidth(), h:$target.outerHeight()} var newattrs={} newattrs.w=(setting.magnifyto)? setting.magnifyto : Math.round(attrs.w*setting.magnifyby) newattrs.h=(setting.magnifyto)? Math.round(attrs.h*newattrs.w/attrs.w) : Math.round(attrs.h*setting.magnifyby) $target.css('cursor', jQuery.imageMagnify.cursorcss) if ($target.data('imgshell')){ $target.data('imgshell').$clone.remove() $target.css({opacity:1}).unbind('click.magnify') } var $clone=$target.clone().css({position:'absolute', left:0, top:0, visibility:'hidden', border:'5px solid white', cursor:'pointer'}).appendTo(document.body) $clone.data('$relatedtarget', $target) //save $target image this enlarged image is associated with $target.data('imgshell', {$clone:$clone, attrs:attrs, newattrs:newattrs}) $target.bind('click.magnify', function(e){ //action when original image is clicked on var $this=$(this).css({opacity:setting.imgopacity}) var imageinfo=$this.data('imgshell') jQuery.imageMagnify.refreshoffsets($(window), $this, imageinfo) //refresh offset positions of original and warped images var $clone=imageinfo.$clone $clone.stop().css({zIndex:++jQuery.imageMagnify.zIndexcounter, left:imageinfo.attrs.x, top:imageinfo.attrs.y, width:imageinfo.attrs.w, height:imageinfo.attrs.h, opacity:0, visibility:'visible'}) .animate({opacity:1, left:imageinfo.newattrs.x, top:imageinfo.newattrs.y, width:imageinfo.newattrs.w, height:imageinfo.newattrs.h}, setting.duration, function(){ //callback function after warping is complete //none added }) //end animate }) //end click $clone.click(function(e){ //action when magnified image is clicked on var $this=$(this) var imageinfo=$this.data('$relatedtarget').data('imgshell') jQuery.imageMagnify.refreshoffsets($(window), $this.data('$relatedtarget'), imageinfo) //refresh offset positions of original and warped images $this.stop().animate({opacity:0, left:imageinfo.attrs.x, top:imageinfo.attrs.y, width:imageinfo.attrs.w, height:imageinfo.attrs.h}, setting.duration, function(){ $this.hide() $this.data('$relatedtarget').css({opacity:1}) //reveal original image }) //end animate }) //end click } }; jQuery.fn.imageMagnify=function(options){ var $=jQuery return this.each(function(){ //return jQuery obj var $imgref=$(this) if (this.tagName!="IMG") return true //skip to next matched element if (parseInt($imgref.css('width'))>0 && parseInt($imgref.css('height'))>0 || options.thumbdimensions){ //if image has explicit width/height attrs defined jQuery.imageMagnify.magnify($, $imgref, options) } else if (this.complete){ //account for IE not firing image.onload jQuery.imageMagnify.magnify($, $imgref, options) } else{ $(this).bind('load', function(){ jQuery.imageMagnify.magnify($, $imgref, options) }) } }) }; jQuery.fn.applyMagnifier=function(options){ //dynamic version of imageMagnify() to apply magnify effect to an image dynamically var $=jQuery return this.each(function(){ //return jQuery obj var $imgref=$(this) if (this.tagName!="IMG") return true //skip to next matched element }) }; //** The following applies the magnify effect to images with class="magnify" and optional "data-magnifyby" and "data-magnifyduration" attrs //** It also looks for links with attr rel="magnify[targetimageid]" and makes them togglers for that image jQuery(document).ready(function($){ var $targets=$('.magnify') $targets.each(function(i){ var $target=$(this) var options={} if ($target.attr('data-magnifyto')) options.magnifyto=parseFloat($target.attr('data-magnifyto')) if ($target.attr('data-magnifyby')) options.magnifyby=parseFloat($target.attr('data-magnifyby')) if ($target.attr('data-magnifyduration')) options.duration=parseInt($target.attr('data-magnifyduration')) $target.imageMagnify(options) }) var $triggers=$('a[rel^="magnify["]') $triggers.each(function(i){ var $trigger=$(this) var targetid=$trigger.attr('rel').match(/\[.+\]/)[0].replace(/[\[\]']/g, '') //parse 'id' from rel='magnify[id]' $trigger.data('magnifyimageid', targetid) $trigger.click(function(e){ $('#'+$(this).data('magnifyimageid')).trigger('click.magnify') e.preventDefault() }) }) }) </script>http://ticklecomics.blogspot.com/2010/11/tee-design-i-love-facebook.htmlnoreply@blogger.com (阿龙龙)tag:blogger.com,1999:blog-6553334891573252023.post-5327990104607356482Tue, 26 Oct 2010 15:40:00 +00002010-10-27T20:45:28.413+08:00Click the post title to view the actual comics.<br /> <img class="magnify" magnifyby="2" style="width: 520px; height: 130px;" src="http://4.bp.blogspot.com/_9GuDjuzimU4/TMb07xAcqGI/AAAAAAAAAFI/zQY1P6TBwvk/s1600/1040x260.jpg" alt="Mario" title="Mario" border="0" /><a name='more'></a>Click on the image to enlarge the comics. <script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like ref='top_left' href="http://ticklecomics.blogspot.com/2010/10/post-with-comments-box-and-like-button_26.html" layout="box_count" width="520"></fb:like>If you like this comics, PLEASE SHARE, SHARING IS LOVE! You can leave any comment on Facebook.<br /> <div class="respond"><h2 style='color:#d7336f'>Post a Comment to Facebook</h2><div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=118978384828178&amp;xfbml=1"> </script><fb:comments width="520"></fb:comments></div><br /> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script><br /> <script type='text/javascript'> /* jQuery Image Magnify script v1.1 * This notice must stay intact for usage * Author: Dynamic Drive at http://www.dynamicdrive.com/ * Visit http://www.dynamicdrive.com/ for full source code * Nov 16th, 09 (v1.1): Adds ability to dynamically apply/reapply magnify effect to an image, plus magnify to a specific width in pixels. */ jQuery.noConflict() jQuery.imageMagnify={ dsettings: { magnifyby: 2.5, //default increase factor of enlarged image duration: 600, //default duration of animation, in millisec imgopacity: 0.2 //opacify of original image when enlarged image overlays it }, cursorcss: 'url(http://tinyurl.com/klq59k), -moz-zoom-in', //Value for CSS's 'cursor' attribute, added to original image zIndexcounter: 1000, refreshoffsets:function($window, $target, warpshell){ var $offsets=$target.offset() var winattrs={x:$window.scrollLeft(), y:$window.scrollTop(), w:$window.width(), h:$window.height()} warpshell.attrs.x=$offsets.left //update x position of original image relative to page warpshell.attrs.y=$offsets.top warpshell.newattrs.x=winattrs.x+winattrs.w/2-warpshell.newattrs.w/2 warpshell.newattrs.y=winattrs.y+winattrs.h/2-warpshell.newattrs.h/2 if (warpshell.newattrs.x<winattrs.x+5){ //no space to the left? warpshell.newattrs.x=winattrs.x+5 } else if (warpshell.newattrs.x+warpshell.newattrs.w > winattrs.x+winattrs.w){//no space to the right? warpshell.newattrs.x=winattrs.x+5 } if (warpshell.newattrs.y<winattrs.y+5){ //no space at the top? warpshell.newattrs.y=winattrs.y+5 } }, magnify:function($, $target, options){ var setting={} //create blank object to store combined settings var setting=jQuery.extend(setting, this.dsettings, options) var attrs=(options.thumbdimensions)? {w:options.thumbdimensions[0], h:options.thumbdimensions[1]} : {w:$target.outerWidth(), h:$target.outerHeight()} var newattrs={} newattrs.w=(setting.magnifyto)? setting.magnifyto : Math.round(attrs.w*setting.magnifyby) newattrs.h=(setting.magnifyto)? Math.round(attrs.h*newattrs.w/attrs.w) : Math.round(attrs.h*setting.magnifyby) $target.css('cursor', jQuery.imageMagnify.cursorcss) if ($target.data('imgshell')){ $target.data('imgshell').$clone.remove() $target.css({opacity:1}).unbind('click.magnify') } var $clone=$target.clone().css({position:'absolute', left:0, top:0, visibility:'hidden', border:'5px solid white', cursor:'pointer'}).appendTo(document.body) $clone.data('$relatedtarget', $target) //save $target image this enlarged image is associated with $target.data('imgshell', {$clone:$clone, attrs:attrs, newattrs:newattrs}) $target.bind('click.magnify', function(e){ //action when original image is clicked on var $this=$(this).css({opacity:setting.imgopacity}) var imageinfo=$this.data('imgshell') jQuery.imageMagnify.refreshoffsets($(window), $this, imageinfo) //refresh offset positions of original and warped images var $clone=imageinfo.$clone $clone.stop().css({zIndex:++jQuery.imageMagnify.zIndexcounter, left:imageinfo.attrs.x, top:imageinfo.attrs.y, width:imageinfo.attrs.w, height:imageinfo.attrs.h, opacity:0, visibility:'visible'}) .animate({opacity:1, left:imageinfo.newattrs.x, top:imageinfo.newattrs.y, width:imageinfo.newattrs.w, height:imageinfo.newattrs.h}, setting.duration, function(){ //callback function after warping is complete //none added }) //end animate }) //end click $clone.click(function(e){ //action when magnified image is clicked on var $this=$(this) var imageinfo=$this.data('$relatedtarget').data('imgshell') jQuery.imageMagnify.refreshoffsets($(window), $this.data('$relatedtarget'), imageinfo) //refresh offset positions of original and warped images $this.stop().animate({opacity:0, left:imageinfo.attrs.x, top:imageinfo.attrs.y, width:imageinfo.attrs.w, height:imageinfo.attrs.h}, setting.duration, function(){ $this.hide() $this.data('$relatedtarget').css({opacity:1}) //reveal original image }) //end animate }) //end click } }; jQuery.fn.imageMagnify=function(options){ var $=jQuery return this.each(function(){ //return jQuery obj var $imgref=$(this) if (this.tagName!="IMG") return true //skip to next matched element if (parseInt($imgref.css('width'))>0 && parseInt($imgref.css('height'))>0 || options.thumbdimensions){ //if image has explicit width/height attrs defined jQuery.imageMagnify.magnify($, $imgref, options) } else if (this.complete){ //account for IE not firing image.onload jQuery.imageMagnify.magnify($, $imgref, options) } else{ $(this).bind('load', function(){ jQuery.imageMagnify.magnify($, $imgref, options) }) } }) }; jQuery.fn.applyMagnifier=function(options){ //dynamic version of imageMagnify() to apply magnify effect to an image dynamically var $=jQuery return this.each(function(){ //return jQuery obj var $imgref=$(this) if (this.tagName!="IMG") return true //skip to next matched element }) }; //** The following applies the magnify effect to images with class="magnify" and optional "data-magnifyby" and "data-magnifyduration" attrs //** It also looks for links with attr rel="magnify[targetimageid]" and makes them togglers for that image jQuery(document).ready(function($){ var $targets=$('.magnify') $targets.each(function(i){ var $target=$(this) var options={} if ($target.attr('data-magnifyto')) options.magnifyto=parseFloat($target.attr('data-magnifyto')) if ($target.attr('data-magnifyby')) options.magnifyby=parseFloat($target.attr('data-magnifyby')) if ($target.attr('data-magnifyduration')) options.duration=parseInt($target.attr('data-magnifyduration')) $target.imageMagnify(options) }) var $triggers=$('a[rel^="magnify["]') $triggers.each(function(i){ var $trigger=$(this) var targetid=$trigger.attr('rel').match(/\[.+\]/)[0].replace(/[\[\]']/g, '') //parse 'id' from rel='magnify[id]' $trigger.data('magnifyimageid', targetid) $trigger.click(function(e){ $('#'+$(this).data('magnifyimageid')).trigger('click.magnify') e.preventDefault() }) }) }) </script>http://ticklecomics.blogspot.com/2010/10/post-with-comments-box-and-like-button_26.htmlnoreply@blogger.com (Anonymous)