Tutorial Rápido, Crea tus propios Thumbnails Icons en IE9
No sé si el título esta correcto, debió ser “Crear tus Thumbnails Icons para la barra de tareas que sean manejados desde JavasScript e IE9”.
En este ejemplo vamos a ver como setear estos íconos.desde nuestra página web.
 |
| Figura1 1 |
Paso 1: Los Iconos
Con estos tres íconos vamos a trabajar, como lo indica la figura 1
Paso 2: El Código:
Para setear los botones, vamos a preguntar al momento de la carga de la página, primero es necesario consultar si es que estamos navegando la página con IE9, por un Bug en la API, debemos utilizar try catch.
Agregamos el manejador de eventos, para indicar que cada vez que se haga click en el botón, vamos a llamar a la funciona manejadorBotones, pasando el botón como argumento. En cada botón vamos a setear el ícono y el tooltip que va a tener en la barra.
window.onload = function () {
try {
if (window.external.msIsSiteMode()) {
document.addEventListener('msthumbnailclick', manejadorBotones, false);
btn1 = window.external.msSiteModeAddThumbBarButton('barra/OFFLINE.ico',
'OFFLINE');
btn2 = window.external.msSiteModeAddThumbBarButton('barra/ONLINEBUSY.ico',
'ONLINEBUSY');
btn3 = window.external.msSiteModeAddThumbBarButton('barra/ONLINE.ico',
'ONLINE');
window.external.msSiteModeShowThumbBar();
}
} catch (ex) {
alert("Debes tener IE9 Instalado");
}
}
El manejador de botones, checkea cual fue el botón que fue presionado y vamos a mostrar en un div, un mensaje para que el usuario pueda ver el resultado de la acción. En nuestro caso es algo simple, pero podría ser una llamada Ajax, etc.
function manejadorBotones(btn) {
if (btn.buttonID == btn1) {
mensaje('LA APLICACION PASA A ESTADO <b>OFFLINE</b>');
}else if (btn.buttonID == btn2) {
mensaje('LA APLICACION PASA A ESTADO <b>ONLINE BUSY</b>');
}else if (btn.buttonID == btn3) {
mensaje('LA APLICACION PASA A ESTADO <b>ONLINE ONLINE</b>');
}
}
function mensaje(msg) {
document.getElementById("msgBarra").innerHTML = msg;
}
Paso 4: Anclar la aplicación a la nuestra Barra de Tareas:
Y ahora, al momento de posicionar el mouse sobre la página anclada:
Vemos en el cuadro, los botones y vamos a poder realizar acciones a la página desde nuestro Windows 7!
Es solo una casualidad que por limitación se puedan agrega 7 iconos como máximo y los íconos deben tener un tamaño de 16x16px.
Bueno, espero que te sirva esta info 
Saludos,
Gonzalo