为动画滑块切片/分割HTML内容

Question

我已经看过几个例子，说明人们如何将图像切割成可以单独制作动画的一堆图块，但是我找不到如何用图像以外的任何其他方法做到这一点的例子，但是希望能够使用HTML内容来获得这样的可视化结果：http://wowslider.com/但不强制它成为图像。

以下是带有图像的示例的Jsfiddle：http://jsfiddle.net/zvdnzx0f/

我必须在这里包含一些代码链接到JsFiddle，这段代码是相关的，因为它使用了Canvas剪辑（），但同样，如何使用HTML内容。

//from: http://jsfiddle.net/y4gRw/
var objImg = new Image();
objImg.onload = function(){ drawIt();}
objImg.src = "http://thumbs.dreamstime.com/x/woman-super-hero-vector-illustrationon-background-34647925.jpg";

function drawIt(){
  var canvas = document.getElementById("canvas-id");
  if(canvas.getContext){
    var ctx= canvas .getContext('2d');
    ctx.beginPath();
    ctx.rect(0, 0, 100, 100);
    ctx.clip();
    ctx.drawImage(objImg, 0, 0);
  }
}