Xem chủ đề cũ hơn Xem chủ đề mới hơn Go down  Thông điệp [Trang 1 trong tổng số 1 trang]

#1Wed Dec 05, 2012 7:14 pm

TuanAnh

TuanAnh



»†ổñg Quån «

Ý Tưởng Mới
Demo:

[code] tooltip đen cực kì đơn giản Tootip10

[code] tooltip đen cực kì đơn giản Tootip11

Code:

Cho vào CSS:
Code:

  .tipsy {
    padding: 5px;
    font-size: 10px;
    position: absolute;
    z-index: 999;

    }

    .tipsy-inner {
    padding: 5px 8px 4px 8px;
    background-color: black;
    color: white;
    max-width: 200px;
    text-align: center;
    }

    .tipsy-inner {
    border-radius: 3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    }

    .tipsy-arrow {
    position: absolute;
    background: url('http://onehackoranother.com/projects/jquery/tipsy/stylesheets/../images/tipsy.gif') no-repeat top left;
    width: 9px;
    height: 5px;
    }

    .tipsy-n .tipsy-arrow {
    top: 0;
    left: 50%;
    margin-left: -4px;
    }

    .tipsy-nw .tipsy-arrow {
    top: 0;
    left: 10px;
    }

    .tipsy-ne .tipsy-arrow {
    top: 0;
    right: 10px;
    }

    .tipsy-s .tipsy-arrow {
    bottom: 0;
    left: 50%;
    margin-left: -4px;
    background-position: bottom left;
    }

    .tipsy-sw .tipsy-arrow {
    bottom: 0;
    left: 10px;
    background-position: bottom left;
    }

    .tipsy-se .tipsy-arrow {
    bottom: 0;
    right: 10px;
    background-position: bottom left;
    }

    .tipsy-e .tipsy-arrow {
    top: 50%;
    margin-top: -4px;
    right: 0;
    width: 5px;
    height: 9px;
    background-position: top right;
    }

    .tipsy-w .tipsy-arrow {
    top: 50%;
    margin-top: -4px;
    left: 0;
    width: 5px;
    height: 9px;
      }

cho vào header:
Code:

<script type="text/javascript" async="" src="http://chupy.googlecode.com/files/vifm.js"></script>

Cách chèn:


Với tootip này thi cách chèn siêu đơn giản. bạn chĩ thêm chữ
Code:
title="Nội dung hiển thị"
trong code muốn chèn tooltip là được
VD muốn chèn tooltip vào hình ảnh bạn làm như sau:

Code:
<img src="link ảnh" title="click vào để xem ảnh với kích thước thật" />
Các cái khác bạn làm theo tương tự.



Được sửa bởi Tuấn Anh ngày Thu Dec 13, 2012 9:50 pm; sửa lần 1.

Trả lời trích dẫnTrả lời

#2Wed Dec 05, 2012 7:37 pm

KenDy Nguyễn

KenDy Nguyễn



» Thàñh Vïêñ Mới

Ý Tưởng Mới
like

Trả lời trích dẫnTrả lời

#3Thu Dec 13, 2012 7:07 pm

avatar

lucr123



» Thàñh Vïêñ Mới

Ý Tưởng Mới
ko hiểu

Trả lời trích dẫnTrả lời

#4Thu Dec 13, 2012 8:35 pm

KenDy Nguyễn

KenDy Nguyễn



» Thàñh Vïêñ Mới

Ý Tưởng Mới
vai

Trả lời trích dẫnTrả lời

#5Thu Dec 13, 2012 9:53 pm

NguyenHung

NguyenHung



» Thàñh Vïêñ Mới

Ý Tưởng Mới
xem

Trả lời trích dẫnTrả lời

Sponsored content




Ý Tưởng Mới

Trả lời trích dẫnTrả lời

Xem chủ đề cũ hơn Xem chủ đề mới hơn Về Đầu Trang  Thông điệp [Trang 1 trong tổng số 1 trang]

Permissions in this forum:
Bạn không có quyền trả lời bài viết