$(window).load(function() {

    //遍历图片；
    $('#content img').each(function(index) {

    //如果图片存在 title 属性；
    if (this.title) {

        //赋值 imgTitle 为图片的 title；
        var imgTitle = this.title;

        //去除图片 title 的值；
        this.title = '';

        //用一个 span 标签把图片包起来，并在图片后面插入一个放置图片 title 的 p 元素；
        $(this).wrap('<span id="img_wrapper"></span>').after('<p id="tooltip">'+imgTitle+'</p>');

        //图片左内边距值；
        var imgPaddingLeft = parseFloat($(this).css('paddingLeft'), 10);

        //获取图片左边框值；
        var imgBorderLeft = parseFloat($(this).css('borderLeftWidth'), 10);

        //获取图片左外边距值；
        var imgMarginLeft = parseFloat($(this).css('marginLeft'), 10);

        //获取图片下内边距值；
        var imgPaddingBottom = parseFloat($(this).css('paddingBottom'), 10);

        //获取图片下边框值；
        var imgBorderBottom = parseFloat($(this).css('borderBottomWidth'), 10);

        //获取图片下外边距值；
        var imgMarginBottom = parseFloat($(this).css('marginBottom'), 10);

        //赋值、获取标题的 left 属性值；
        var imgPositionLeft = imgPaddingLeft + imgBorderLeft + imgMarginLeft + 'px';

        //赋值、获取标题的 bottom 属性值；
        var imgPositionBottom = imgPaddingBottom + imgBorderBottom + imgMarginBottom +'px';

        //如果图片有浮动，则把浮动去除并转移到父元素 #img_wrapper 上；
        var imgFloat = $(this).css('float');
        var $img_wrapper = $(this).parent('#img_wrapper');
        if (imgFloat !== 'none') {
            $(this).css('float', 'none');
            $img_wrapper.css({'float': imgFloat});
        }

        //获取图片的宽度；
        var imgWidth = $(this).width() + 'px';

        //赋值、获取标题的最高高度；
        var tipHeight = parseFloat($(this).height(), 10);
        tipHeight *= 0.5;
        var $tooltip = $(this).next('#tooltip');

        //设置标题 p 元素的显示位置、宽度、透明度，并隐藏；
        $tooltip
            .css({'max-height': tipHeight, 'width': imgWidth, 'left': imgPositionLeft, 'bottom': imgPositionBottom})
            .fadeTo('opacity', 0.8).hide();

        //鼠标滑过 #img_wrapper 时显示 title，滑出则隐藏。
        $img_wrapper.hover(function() {
            $tooltip.fadeIn('slow');
        }, function() {
            $tooltip.fadeOut('slow');
        });
    }
    });
});