Membuat daftar menu type menu Dtree

Jika anda belum tau apa itu Menu Type Menu Dtree , silahkan anda klik saja dulu folder-folder yang ada dibawah ini.

Judul label 1
Judul label 2
Judul label 3
Judul label 4
Judul label 5
- Judul posting anda
- Judul posting anda
- Judul posting anda
- Judul posting anda
- Label 5.1
- Label 5.2

Cara membuatnya tinggal anda copy kode dibawah ini , edit sesuai keinginan anda , anda bebas meletakkannya dimana saja terserah anda.

// ## flipMenu 5.0.0 (c) J. Reijers
// ## Last modifications: 23 March 2007

// ######################################################################

// ## Degree of indentation from the left.
    flipIndentation = "5px";

// ## Padding inbetween menu items.
    flipVerticalPadding = "4px";

// ## Margin between the left of the browser and the menu.
    flipLeftMargin = "16px";

// ## Margin between the top of the browser and the menu.
    flipTopMargin = "10px";

// ## Allow multiple menus to fold out without closing all the other open ones.
    flipOpenMultipleMenus = false;

// ## Preserve the current state of the menu (requires cookies).
    flipSaveMenuState = true;

// ## Use custom images for bullets
    flipImages = true;

// ## Images to use (specify full path)
    flipImg_open   = "http://4.bp.blogspot.com/-XLJqD_Hkg_s/UBu45Lv5U7I/AAAAAAAABoc/tlmeM_RGY0k/s1600/flip_open.gif";
    flipImg_closed = "http://1.bp.blogspot.com/-YQUONBOTPTg/UBu4yd8Tz5I/AAAAAAAABoU/S7rkNcOYjU0/s1600/flip_closed.gif";
    flipImg_static = "http://4.bp.blogspot.com/-OF-iO-nyjYI/UBu5H3LU7BI/AAAAAAAABok/ZgyII9eEdiY/s1600/flip_static.gif";

// ## Initialise all flipMenus onload
    flipInitOnLoad = true;

// ## Message to display in status bar while loading
    flipLoadingMessage = "Loading...";

// ######################################################################

function alterSize(someSize, alterAmount) {
    someSize = String(someSize);
    var tmpNr = parseFloat(someSize.replace(/\D/g, ""));
    var tmpChar = someSize.replace(/\d/g, "");
    return isNaN(tmpNr) ? someSize : ((tmpNr + alterAmount) + tmpChar);
}

isIE = (String(navigator.appVersion).indexOf("MSIE") > -1);
if (!isIE) flipIndentation = alterSize(flipIndentation, -16);
if (!isIE) flipLeftMargin = alterSize(flipLeftMargin, -16);

document.write(
    "<style type=\"text/css\">" +

"ul.flipMenu { margin-top: " + flipTopMargin + "; margin-left: " + flipLeftMargin + "; " + (flipImages ? "" : "list-style-type: none;") + " }" +
    "ul.flipMenu ul, ul.flipMenu li { padding-top: " + flipVerticalPadding + "; margin-left: " + flipIndentation + "; margin_right: 0px; " + (flipImages ? "" : "list-style-type: none;") + " }" +

"li.flipFolderOpen { cursor: pointer; " + (flipImages ? "list-style-image: url(" + flipImg_open + ");" : "") + " }" +
    "li.flipFolderClosed { cursor: pointer; " + (flipImages ? "list-style-image: url(" + flipImg_closed + ");" : "") + " }" +

"</style>"
);

if (flipImages) {
    aFlipPreloads = [];
    aFlipPreloads[0] = new Image;
    aFlipPreloads[0].src = flipImg_open;
    aFlipPreloads[1] = new Image;
    aFlipPreloads[1].src = flipImg_closed;
    aFlipPreloads[2] = new Image;
    aFlipPreloads[2].src = flipImg_static;
}

function addEvent(someObj, someEvent, someFunction) {
    if (someObj.addEventListener) { someObj.addEventListener(someEvent, someFunction, true); return true; } else if (someObj.attachEvent) return someObj.attachEvent("on" + someEvent, someFunction); else return false;
}

function openFlip(theItem, openParents) {
    openCloseFlip(theItem, "open", openParents);
}

function closeFlip(theItem, closeParents) {
    openCloseFlip(theItem, "closed", closeParents);
}

function toggleFlip(theElement) {
    if (theElement.flipID) {
        var theItem = theElement;
        var isContained = true;
    } else {
        if (theElement && theElement.button > 0) return false;
        var theItem = (isIE) ? event.srcElement : theElement.target;

var isContained = false;
        if (theItem.className == "flipFolderOpen" || theItem.className == "flipFolderClosed") isContained = true; else while (theItem.parentElement || theItem.parentNode) {
            if (theItem.className == "flipStatic" || theItem.className == "flipFolderOpen" || theItem.className == "flipFolderClosed") {
                isContained = (theItem.className == "flipFolderOpen" || theItem.className == "flipFolderClosed");
                break;
            }
            theItem = (theItem.parentElement) ? theItem.parentElement : theItem.parentNode;
        }
    }

var toOpenFlip = (isContained && theItem.className == "flipFolderClosed");

if (!flipOpenMultipleMenus && (toOpenFlip || theItem.className == "flipStatic")) {
        if (theItem.parentElement || theItem.parentNode) {
            var parentUL = (theItem.parentElement) ? theItem.parentElement : theItem.parentNode;
            for (var i = 0; i < parentUL.childNodes.length; i++) closeFlip(parentUL.childNodes[i]);
        }
    }

if (isContained) {
        if (toOpenFlip) openFlip(theItem); else closeFlip(theItem);
    }
}

function setAllFlips(startElement, newSetting) {
    if (typeof startElement == "undefined") var startElement = document;
    if (typeof newSetting == "undefined") var newSetting = "closed";

var aUL = startElement.getElementsByTagName("UL");
    for (var i = 0; i < aUL.length; i++) {
        var parentFlip = aUL[i].parentElement ? aUL[i].parentElement : aUL[i].parentNode;
        openCloseFlip(parentFlip, newSetting);
    }
}

function openAllFlips(startElement) {
    setAllFlips(startElement, "open");
}

function closeAllFlips(startElement) {
    setAllFlips(startElement, "closed");
}

function initFlip(startElement) {
    if (!document.createElement) return false;

if (!startElement || !startElement.nodeName) {
        var aUL = document.getElementsByTagName("UL");
        for (var i = 0; i < aUL.length; i++) {
            if (flipLoadingMessage != "") window.status = flipLoadingMessage + " " + parseInt((i / (aUL.length - 1)) * 100, 10) + "%";
            var curUL = aUL[i];
            if (curUL.className == "flipMenu") {
                initFlip(curUL);

// ## Fix text selecting problem in Mozilla
                curUL.onselectstart = new Function("return false");
                curUL.onmousedown = new Function("return false");
                curUL.onclick = new Function("return true");
            }
        }

if (flipSaveMenuState) loadMenuState();

if (flipLoadingMessage != "") window.status = "";
        return true;
    }

if (startElement.className == "flipMenu") startElement.style.display = "";

if (!startElement.childNodes || startElement.childNodes.length == 0) return false;

if (typeof flipIDCur == "undefined") flipIDCur = 0;
    if (!startElement.initialised) {
        var aUL = startElement.getElementsByTagName("UL");
        for (var i = 0; i < aUL.length; i++) aUL[i].style.display = "none";
    }

for (var i = 0; i < startElement.childNodes.length; i++) {
        var curNode = startElement.childNodes[i];
        if (curNode.nodeName == "LI") {
            flipIDCur++;
            curNode.flipID = flipIDCur;

var nodeHasChildren = curNode.getElementsByTagName("UL").length > 0;
            if (nodeHasChildren) {
                if (flipImages && curNode.flipClosed) curNode.style.listStyleImage = "url(" + curNode.flipClosed + ")";

if (curNode.className == null || curNode.className == "") curNode.className = "flipFolderClosed";
            } else {
                curNode.className = "flipStatic";
                if (flipImages && !curNode.style.listStyleImage) {
                    if (!curNode.flipStatic) curNode.flipStatic = flipImg_static;
                    curNode.style.listStyleImage = "url(" + curNode.flipStatic + ")";
                }
            }

if (!curNode.flipOpen) curNode.flipOpen = flipImg_open;
            if (!curNode.flipClosed) curNode.flipClosed = flipImg_closed;

if (curNode.flipIsOpen) openFlip(curNode);
        }
    }

startElement.initialised = true;
}

function rootOfFlip(flipID, startElement) {

function containsFlip(startElement, flipID) {
        var flipFound = false;
        var i = 0;
        while (i < startElement.childNodes.length && !flipFound) {
            var curNode = startElement.childNodes[i];
            flipFound = (curNode.flipID == flipID) ? true : containsFlip(curNode, flipID);
            i++;
        }
        return flipFound;
    }

var rootFlip = null;

if (!startElement || !startElement.nodeName) {
        var aUL = document.getElementsByTagName("UL");
        var i = 0;
        while (rootFlip == null && i < aUL.length) {
            var curUL = aUL[i];
            if (curUL.nodeName == "UL" && curUL.className == "flipMenu") rootFlip = rootOfFlip(flipID, curUL);
            i++;
        }
        return rootFlip;
    }

if (startElement.childNodes) for (var i = 0; i < startElement.childNodes.length; i++) {
        var curNode = startElement.childNodes[i];
        if (curNode.flipID == flipID || containsFlip(curNode, flipID)) rootFlip = curNode;
    }

return rootFlip;
}

function getCookie(cookieName) {
    var allCookies = document.cookie;
    var indexStr = allCookies.indexOf(cookieName + "=");
    if (indexStr == -1) return "";
    indexStr = allCookies.indexOf("=", indexStr) + 1;
    var endStr = allCookies.indexOf(";", indexStr);
    if (endStr == -1) endStr = allCookies.length;
    return unescape(allCookies.substring(indexStr, endStr));
}

function inArray(someID, someArray) {
    for (var i = 0; i < someArray.length; i++) if (someArray[i] == someID) return true;
    return false;
}

function getMenuState(startElement) {
    if (!startElement.childNodes || startElement.childNodes.length == 0) return "";

var openItems = "";
    var aUL = startElement.getElementsByTagName("UL");
    for (var i = 0; i < aUL.length; i++) {
        var curNode = aUL[i];
        var parentFlip = (curNode.parentElement) ? curNode.parentElement : curNode.parentNode;
        if (curNode.style.display == "" && parentFlip.flipID) openItems += " " + parentFlip.flipID;        
    }
    return openItems;
}

function putMenuState(startElement) {
    if (!startElement.childNodes || startElement.childNodes.length == 0) return false;

addEvent(window, "unload", saveMenuState);
}

cookiePrefix = document.location.pathname + "_";

addEvent(document, "click", toggleFlip);
if (flipInitOnLoad) addEvent(window, "load", initFlip);
</script>

<ul class="flipMenu">
<li>Judul label 1
<ul>
<li><a href="http://dhecun.blogspot.com/"> Kumpulan script untuk blogspot   </a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
</ul>
</li>
<li>Judul label 2
<ul>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
</ul>
</li>
<li>Judul label 3
<ul>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
</ul>
</li>
<li>Judul label 4
<ul>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
</ul>
</li>
<li>Judul label 5
<ul>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li>Label 5.1
<ul>
<li style="list-style-image: url(http://3.bp.blogspot.com/-4ZJ80hEd4Lk/UBu5c8-vHrI/AAAAAAAABos/eJltD-lhPNA/s1600/flip_google.gif)"><a href="http://www.google.com">Google</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
</ul>
</li>
<li>Label 5.2
<ul>
<li style="list-style-image: url(http://3.bp.blogspot.com/-4ZJ80hEd4Lk/UBu5c8-vHrI/AAAAAAAABos/eJltD-lhPNA/s1600/flip_google.gif)">
<a href="http://www.google.com">Google</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
<li><a href="Link posting anda"> Judul posting anda</a></li>
</ul>
</li>
</ul>
</li>
</ul>

Komentar menggunakan Facebook

Admin

.:: Get Widget ::.

Keterangan Artikel

Ditulis oleh : Dhecun Blog
Judul : Membuat daftar menu type menu Dtree
Berlangganan artikel
Komentari artikel ini...!!!

<b>Dhecun Blog : <a href='http://dhecun.blogspot.com/2012/11/membuat-daftar-menu-type-menu-dtree.html'>Membuat daftar menu type menu Dtree</a></b>

Silahkan Copy Paste artikel ini tapi jangan lupa untuk mencantumkan link sumber aslinya. Terima kasih.

Widget Zoom Detail Gambar

.magnifyarea{ /* CSS to add shadow to magnified image. Optional */
box-shadow: 5px 5px 7px #818181;
-webkit-box-shadow: 5px 5px 7px #818181;
-moz-box-shadow: 5px 5px 7px #818181;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#818181, offX=5, offY=5, positive=true);
background: white;
}

</style>

/***********************************************
* Frame dcode

***********************************************/

</script>

jQuery(document).ready(function($){

$('#image1').addimagezoom({
  zoomrange: [3, 30],
  magnifiersize: [500,500],
  magnifierpos: 'right',
  cursorshade: true,
  largeimage: 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSjU2O8BeMy8MvPmMYlB_xUs08Ebhn8Brb2wbGfp52nkvrSLS8vPCtxu_iHbXQOSjzpn14BZ5B7F8n8TOjDClFgh2mLenlkAzGT_4AP5qrFQhNFtNaJnUjWYTpl-RCEWnmrog05W7JuHM/s1600/DhecunBlog.png' //<-- No comma after last option!
 })

$('#image2').addimagezoom({
  zoomrange: [5, 5],
  magnifiersize: [400,400],
  magnifierpos: 'right',
  cursorshade: true,
  cursorshadecolor: 'pink',
  cursorshadeopacity: 0.3,
  cursorshadeborder: '1px solid red',
  largeimage: 'alamat gambar 2' //<-- No comma after last option!
 })

$('#image3').addimagezoom()

})

</script>

// feb 2 12
// modifikasi script

jQuery.noConflict()

jQuery('head').append('<style type="text/css">.featuredimagezoomerhidden {visibility: hidden!important;}</style>');

var featuredimagezoomer={
 loadinggif: 'spinningred.gif', //full path or URL to "loading" gif
 magnifycursor: 'crosshair', //Value for CSS's 'cursor' attribute, added to original image

/////NO NEED TO EDIT BEYOND HERE////////////////
 dsetting: { //default settings
   magnifierpos: 'right',
   magnifiersize:[200, 200],
   cursorshadecolor: '#fff',
   cursorshadeopacity: 0.3,
   cursorshadeborder: '1px solid black',
   cursorshade: false,
   leftoffset: 15, //offsets here are used (added to) the width of the magnifyarea when
   rightoffset: 10 //calculating space requirements and to position it visa vis any drop shadow
  },
 isie: (function(){/*@cc_on @*//*@if(@_jscript_version >= 5)return true;@end @*/return false;})(), //is this IE?

showimage: function($, $tracker, $mag, showstatus){
  var specs=$tracker.data('specs'), d=specs.magpos, fiz=this;
  var coords=$tracker.data('specs').coords //get coords of tracker (from upper corner of document)
  specs.windimensions={w:$(window).width(), h:$(window).height()}; //remember window dimensions
  var magcoords={} //object to store coords magnifier DIV should move to
  magcoords.left = coords.left + (d === 'left'? -specs.magsize.w - specs.lo : $tracker.width() + specs.ro);
  //switch sides for magnifiers that don't have enough room to display on the right if there's room on the left:
  if(d!=='left' && magcoords.left + specs.magsize.w + specs.lo >= specs.windimensions.w && coords.left - specs.magsize.w >= specs.lo){
   magcoords.left = coords.left - specs.magsize.w - specs.lo;
  } else if(d==='left' && magcoords.left < specs.ro) { //if there's no room on the left, move to the right
   magcoords.left = coords.left + $tracker.width() + specs.ro;
  }
  $mag.css({left: magcoords.left, top:coords.top}).show(); //position magnifier DIV on page
  specs.$statusdiv.html('Current Zoom: '+specs.curpower+'<div style="font-size:100%">Use Mouse Wheel to Zoom In/Out</div>');
  if (showstatus) //show status DIV? (only when a range of zoom is defined)
   fiz.showstatusdiv(specs, 400, 2000);
 },

hideimage: function($tracker, $mag, showstatus){
  var specs=$tracker.data('specs');
  $mag.hide();
  if (showstatus)
   this.hidestatusdiv(specs);
 },

showstatusdiv: function(specs, fadedur, showdur){
  clearTimeout(specs.statustimer)
  specs.$statusdiv.fadeIn(fadedur) //show status div
  specs.statustimer=setTimeout(function(){featuredimagezoomer.hidestatusdiv(specs)}, showdur) //hide status div after delay
 },

hidestatusdiv: function(specs){
  specs.$statusdiv.stop(true, true).hide()
 },

getboundary: function(b, val, specs){ //function to set x and y boundaries magnified image can move to (moved outside moveimage for efficiency)
  if (b=="left"){
   var rb=-specs.imagesize.w*specs.curpower+specs.magsize.w
   return (val>0)? 0 : (val<rb)? rb : val
  }
  else{
   var tb=-specs.imagesize.h*specs.curpower+specs.magsize.h
   return (val>0)? 0 : (val<tb)? tb : val
  }
 },

moveimage: function($tracker, $maginner, $cursorshade, e){
  var specs=$tracker.data('specs'), csw = Math.round(specs.magsize.w/specs.curpower), csh = Math.round(specs.magsize.h/specs.curpower),
  csb = specs.csborder, fiz = this, imgcoords=specs.coords, pagex=(e.pageX || specs.lastpagex), pagey=(e.pageY || specs.lastpagey),
  x=pagex-imgcoords.left, y=pagey-imgcoords.top;
  $cursorshade.css({ // keep shaded area sized and positioned proportionately to area being magnified
   visibility: '',
   width: csw,
   height: csh,
   top: Math.min(specs.imagesize.h-csh-csb, Math.max(0, y-(csb+csh)/2)) + imgcoords.top,
   left: Math.min(specs.imagesize.w-csw-csb, Math.max(0, x-(csb+csw)/2)) + imgcoords.left
  });
  var newx=-x*specs.curpower+specs.magsize.w/2 //calculate x coord to move enlarged image
  var newy=-y*specs.curpower+specs.magsize.h/2
  $maginner.css({left:fiz.getboundary('left', newx, specs), top:fiz.getboundary('top', newy, specs)})
  specs.$statusdiv.css({left:pagex-10, top:pagey+20})
  specs.lastpagex=pagex //cache last pagex value (either e.pageX or lastpagex), as FF1.5 returns undefined for e.pageX for "DOMMouseScroll" event
  specs.lastpagey=pagey
 },

magnifyimage: function($tracker, e, zoomrange){
  var delta=e.detail? e.detail*(-120) : e.wheelDelta //delta returns +120 when wheel is scrolled up, -120 when scrolled down
  var zoomdir=(delta<=-120)? "out" : "in"
  var specs=$tracker.data('specs')
  var magnifier=specs.magnifier, od=specs.imagesize, power=specs.curpower
  var newpower=(zoomdir=="in")? Math.min(power+1, zoomrange[1]) : Math.max(power-1, zoomrange[0]) //get new power
  var nd=[od.w*newpower, od.h*newpower] //calculate dimensions of new enlarged image within magnifier
  magnifier.$image.css({width:nd[0], height:nd[1]})
  specs.curpower=newpower //set current power to new power after magnification
  specs.$statusdiv.html('Current Zoom: '+specs.curpower)
  this.showstatusdiv(specs, 0, 500)
  $tracker.trigger('mousemove')
 },

init: function($, $img, options){
  var setting=$.extend({}, this.dsetting, options), w = $img.width(), h = $img.height(), o = $img.offset(),
  fiz = this, $tracker, $cursorshade, $statusdiv, $magnifier, lastpage = {pageX: 0, pageY: 0};
  setting.largeimage = setting.largeimage || $img.get(0).src;
  $magnifier=$('<div class="magnifyarea" style="position:absolute;width:'+setting.magnifiersize[0]+'px;height:'+setting.magnifiersize[1]+'px;left:-10000px;top:-10000px;visibility:hidden;overflow:hidden;border:1px solid black;" />')
   .append('<div style="position:relative;left:0;top:0;" />')
   .appendTo(document.body) //create magnifier container
  //following lines - create featured image zoomer divs, and absolutely positioned them for placement over the thumbnail and each other:
  if(setting.cursorshade){
   $cursorshade = $('<div class="cursorshade" style="visibility:hidden;position:absolute;left:0;top:0;" />')
    .css({border: setting.cursorshadeborder, opacity: setting.cursorshadeopacity, backgroundColor: setting.cursorshadecolor})
    .appendTo(document.body);
  } else {
   $cursorshade = $('<div />'); //dummy shade div to satisfy $tracker.data('specs')
  }
  $statusdiv = $('<div class="zoomstatus preloadevt" style="position:absolute;visibility:hidden;left:0;top:0;" />')
   .html('<img src="'+this.loadinggif+'" />')
   .appendTo(document.body); //create DIV to show "loading" gif/ "Current Zoom" info
  $tracker = $('<div class="zoomtracker" style="cursor:progress;position:absolute;left:'+o.left+'px;top:'+o.top+'px;height:'+h+'px;width:'+w+'px;" />')
   .css({backgroundImage: (this.isie? 'url(cannotbe)' : 'none')})
   .appendTo(document.body);
  $(window).resize(function(){ //in case resizing the window repostions the image
    var o = $img.offset();
    $tracker.css({left: o.left, top: o.top});
   });

function getspecs($maginner, $bigimage){ //get specs function
   var magsize={w:$magnifier.width(), h:$magnifier.height()}
   var imagesize={w:w, h:h}
   var power=(setting.zoomrange)? setting.zoomrange[0] : ($bigimage.width()/w).toFixed(5)
   $tracker.data('specs', {
    $statusdiv: $statusdiv,
    statustimer: null,
    magnifier: {$outer:$magnifier, $inner:$maginner, $image:$bigimage},
    magsize: magsize,
    magpos: setting.magnifierpos,
    imagesize: imagesize,
    curpower: power,
    coords: getcoords(),
    csborder: $cursorshade.outerWidth(),
    lo: setting.leftoffset,
    ro: setting.rightoffset
   })
  }

function getcoords(){ //get coords of thumb image function
   var offset=$tracker.offset() //get image's tracker div's offset from document
   return {left:offset.left, top:offset.top}
  }

$tracker.mouseover(function(e){
     $cursorshade.add($magnifier).add($statusdiv).removeClass('featuredimagezoomerhidden');
     $tracker.data('premouseout', false);
   }).mouseout(function(e){
     $cursorshade.add($magnifier).add($statusdiv.not('.preloadevt')).addClass('featuredimagezoomerhidden');
     $tracker.data('premouseout', true);
   }).mousemove(function(e){ //save tracker mouse position for initial magnifier appearance, if needed
    lastpage.pageX = e.pageX;
    lastpage.pageY = e.pageY;
   });

$tracker.one('mouseover', function(e){
   var $maginner=$magnifier.find('div:eq(0)')
   var $bigimage=$('<img src="'+setting.largeimage+'"/>').appendTo($maginner)
   var showstatus=setting.zoomrange && setting.zoomrange[1]>setting.zoomrange[0]
   $img.css({opacity:0.1}) //"dim" image while large image is loading
   var imgcoords=getcoords()
   $statusdiv.css({left:imgcoords.left+w/2-$statusdiv.width()/2, top:imgcoords.top+h/2-$statusdiv.height()/2, visibility:'visible'})
   $bigimage.bind('loadevt', function(){ //magnified image ONLOAD event function (to be triggered later)
    $img.css({opacity:1}) //restore thumb image opacity
    $statusdiv.empty().css({border:'1px solid black', background:'#C0C0C0', padding:'4px', font:'bold 13px Arial', opacity:0.8}).hide().removeClass('preloadevt');
    if($tracker.data('premouseout')){
     $statusdiv.addClass('featuredimagezoomerhidden');
    }
    if (setting.zoomrange){ //if set large image to a specific power
     var nd=[w*setting.zoomrange[0], h*setting.zoomrange[0]] //calculate dimensions of new enlarged image
     $bigimage.css({width:nd[0], height:nd[1]})
    }
    getspecs($maginner, $bigimage) //remember various info about thumbnail and magnifier
    $magnifier.css({display:'none', visibility:'visible'})
    $tracker.mouseover(function(e){ //image onmouseover
     $tracker.data('specs').coords=getcoords() //refresh image coords (from upper left edge of document)
     fiz.showimage($, $tracker, $magnifier, showstatus)
    })
    $tracker.mousemove(function(e){ //image onmousemove
     fiz.moveimage($tracker, $maginner, $cursorshade, e)
    })
    if (!$tracker.data('premouseout')){
     fiz.showimage($, $tracker, $magnifier, showstatus);
     fiz.moveimage($tracker, $maginner, $cursorshade, lastpage);
    }
    $tracker.mouseout(function(e){ //image onmouseout
     fiz.hideimage($tracker, $magnifier, showstatus)
    }).css({cursor: fiz.magnifycursor});
    if (setting.zoomrange && setting.zoomrange[1]>setting.zoomrange[0]){ //if zoom range enabled
     $tracker.bind('DOMMouseScroll mousewheel', function(e){
      fiz.magnifyimage($tracker, e, setting.zoomrange);
      e.preventDefault();
     });
    }
   }) //end $bigimage onload
   if ($bigimage.get(0).complete){ //if image has already loaded (account for IE, Opera not firing onload event if so)
    $bigimage.trigger('loadevt')
   }
   else{
    $bigimage.bind('load', function(){$bigimage.trigger('loadevt')})
   }
  })
 },

iname: (function(){var itag = jQuery('<img />'), iname = itag.get(0).tagName; itag.remove(); return iname;})()
};

jQuery.fn.addimagezoom=function(options){
 var $=jQuery;
 return this.each(function(){ //return jQuery obj
  if (this.tagName !== featuredimagezoomer.iname)
   return true; //skip to next matched element
  featuredimagezoomer.init($, $(this), options);
 });
}
</script>
<p><img id="image1" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSjU2O8BeMy8MvPmMYlB_xUs08Ebhn8Brb2wbGfp52nkvrSLS8vPCtxu_iHbXQOSjzpn14BZ5B7F8n8TOjDClFgh2mLenlkAzGT_4AP5qrFQhNFtNaJnUjWYTpl-RCEWnmrog05W7JuHM/s1600/DhecunBlog.png" style="width:170px;height:170px" /><p></p></p> 
<center>Mainkan roda mouse anda untuk membuat tampilan lebih besar</center>
<br/>
<div style="text-align:center; font-size:0.75em">
<a href="http://dhecun.blogspot.com/2012/11/script-zoom-gambar-dengan-detail.html">[ Get Widget ]</a></div>

Widget Share Button Melayang

<style>

#pageshare {position:fixed; bottom:15%; right:10px; float:left; border: 1px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#eff3fa;padding:0 0 2px

0;z-index:10;}

#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}

.fb_share_count_top {width:48px !important;}

.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}

.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}

.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}

</style>
<div id='pageshare' title="bagikan ke teman anda">
<div class='sbutton' id='gb'><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class='sbutton' id='rt'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></div>
<div class='sbutton' id='gplusone'><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<div class='sbutton' id='su'><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<div class='sbutton' id='digg' style='margin-left:3px;width:48px'><script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script><a class="DiggThisButton DiggMedium"></a></div>
<div class='sbutton' id='fb'><a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script></div><br/><div style="clear: both;font-size: 9px;text-align:center;"><a href="http://dhecun.blogspot.com/2012/11/memasang-widget-share-button-facebook.html" target="blank" title="Cara Memasang Widget Share Button"><font color="blue">[Get Widget]<font></font></font></a></div></div>

Blogger templates

Pages

Beranda

My Facebook

Kirim SMS Gratis

Download Gratis

Contact us

Dhecun Blog

Membuat daftar menu type menu Dtree

Saturday, November 17, 2012

Pasang Widget Otomatis

Submit Web / Blog Ke 20+ Search Engines

Cek Ukuran dan Kecepatan Loading Blog / Web

Update Artikel Dhecun Blog

Berlangganan Artikel Gratis Lewat Email

Berlangganan artikel via email.

Space Iklan

Kategori pasang iklan

Iklan Sponsor 1

About Me

Contact

Rekomendasi

Follow

RSS feeds

Widget Populer

Share

Tukar Link

Traffic

Semua Artikel

10 Artikel Terbaru

Followers

Advertiser

Pasang iklan dapat diut