Trang ChínhTrang Chính  Latest imagesLatest images  Tìm kiếmTìm kiếm  Đăng kýĐăng ký  Đăng NhậpĐăng Nhập  

News & Announcements
  • Gallery & Others

Trang 1 trong tổng số 1 trang
 

 [Codes] Hiệu ứng tooltip đen

Xem chủ đề cũ hơn Xem chủ đề mới hơn Go down 
Bookmark and Share
   
[Codes] Hiệu ứng tooltip đen  Collap10 [Codes] Hiệu ứng tooltip đen  EmptySun Sep 04, 2011 9:38 pm

Administrator
Administrator 

Administrator

https://forumotion.forumvi.net
Posts Posts : 73
Points Points : 175
Thanked Thanked : 8
Sinh Nhật Sinh Nhật : 19/11/1996
Tham Gia Tham Gia : 02/09/2011
Đến từ Đến từ : 1 nơi nào đó
Posts Posts : 73
Points Points : 175
Thanked Thanked : 8
Sinh Nhật Sinh Nhật : 19/11/1996
Tham Gia Tham Gia : 02/09/2011
Đến từ Đến từ : 1 nơi nào đó
Bài gửiTiêu đề: [Codes] Hiệu ứng tooltip đen

[Codes] Hiệu ứng tooltip đen  3477152822 Bước 1: Tạo 1 trang html, sao chép và paste codes sau vào và save lạ

Code:
var offsetfromcursorX = 12;
var offsetfromcursorY = 10;
var offsetdivfrompointerX = 10;
var offsetdivfrompointerY = 13;
document.write('<div id="dhtmltooltip"></div>');
document.write('<img id="dhtmlpointer" src="http://www.c3zone.net/users/2611/10/63/87/album/pointe10.gif">');
var ie = document.all;
var ns6 = document.getElementById && ! document.all;
var enabletip = false;
var  tipobj = document.getElementById("dhtmltooltip");
var pointerobj = document.getElementById("dhtmlpointer");
function ietruebody() {
  return (document.compatMode && document.compatMode != "BackCompat") ? document.documentElement : document.body;
}
String.prototype.trim = function () {
    return this.replace(/^\s*/, "").replace(/\s*$/, "");
}
function showtip(thetext, thewidth, thecolor) {
  if (ns6 || ie) {
      if (typeof thewidth != "undefined")
        tipobj.style.width = thewidth + "px";
      if (typeof thecolor != "undefined" && thecolor != "")
        tipobj.style.backgroundColor = thecolor;
      thetext = thetext.trim();
      var arr = thetext.split(" ");
      for(i=0;i<arr.length;i++)
        if(arr[i].length>=40)
            thetext=thetext.replace(arr[i],arr[i].substr(0,40)+"...");
      tipobj.innerHTML = thetext;     
      enabletip = true;
      return false;
  }
}
function positiontip(e) {
  if (enabletip) {     
      var nondefaultpos = false;
      var curX = (ns6) ? e.pageX : event.clientX + ietruebody().scrollLeft;
      var curY = (ns6) ? e.pageY : event.clientY + ietruebody().scrollTop;
      var winwidth = ie && ! window.opera ? ietruebody().clientWidth : window.innerWidth - 20;
      var winheight = ie && ! window.opera ? ietruebody().clientHeight : window.innerHeight - 20;
      var rightedge = ie && ! window.opera ? winwidth - event.clientX - offsetfromcursorX : winwidth - e.clientX - offsetfromcursorX;
      var bottomedge = ie && ! window.opera ? winheight - event.clientY - offsetfromcursorY : winheight - e.clientY - offsetfromcursorY;
      var leftedge = (offsetfromcursorX < 0) ? offsetfromcursorX * (- 1) : - 1000;
      if (rightedge < tipobj.offsetWidth) {
        tipobj.style.left = curX - tipobj.offsetWidth + "px";
        nondefaultpos = true;
      }
      else if (curX < leftedge)
        tipobj.style.left = "5px";
      else {
        tipobj.style.left = curX + offsetfromcursorX - offsetdivfrompointerX + "px";
        pointerobj.style.left = curX + offsetfromcursorX + "px";
      }
      if (bottomedge < tipobj.offsetHeight) {
        tipobj.style.top = curY - tipobj.offsetHeight - offsetfromcursorY + "px";
        nondefaultpos = true;
      }
      else {
        tipobj.style.top = curY + offsetfromcursorY + offsetdivfrompointerY + "px";
        pointerobj.style.top = curY + offsetfromcursorY + "px";
      }
      tipobj.style.visibility = "visible";
 
      if (! nondefaultpos)
        pointerobj.style.visibility = "visible";
      else
        pointerobj.style.visibility = "hidden";
  }
}
function hidetip() {
  if (ns6 || ie) {
      enabletip = false;
      tipobj.style.visibility = "hidden";
      pointerobj.style.visibility = "hidden";
      tipobj.style.left = "-1000px";
      tipobj.style.backgroundColor = '';
      tipobj.style.width = '';
  }
}
document.onmousemove = positiontip;

[Codes] Hiệu ứng tooltip đen  1361424789 Bước 2: Lấy url trang html trên thay vô đoạn code script sau:

Code:
<script type="text/javascript" src="url trang html"></script>

[Codes] Hiệu ứng tooltip đen  3063782546 Bước 3: sao chép và chèn script trên vào trước thẻ

Code:
</head>

trong Overall_header

[Codes] Hiệu ứng tooltip đen  3596227959 Bước 4: Thêm đoạn code sau dưới cùng CSS

Code:
/* tooltip-------------------------------------------------------------*/

#dhtmlpointer, #dhtmltooltip
{
  z-index: 999;
  left: -300px; top:0px;
  visibility: hidden;
  position: absolute;
}
#dhtmltooltip
{-moz-opacity:.8;filter:alpha(opacity=80);left:-300px;opacity:.8;position:absolute;top:0;visibility:hidden;z-index:999}#c3tooltip{-moz-border-radius:6px;-webkit-border-radius:6px;background-color:#000;border:#000 0 solid;border-radius:6px;color:#fff;font-family:Arial;font-size:9pt;font-weight:700;max-width:340px;padding:15px;text-align:left;width:expression(document.body.clientWidth>340?"340px":"auto")}

Chữ Ký


Trang 1 trong tổng số 1 trang
 

[Codes] Hiệu ứng tooltip đen

Xem chủ đề cũ hơn Xem chủ đề mới hơn Về Đầu Trang 
[Codes] Hiệu ứng tooltip đen  Collap10
♥๑۩۞۩๑ (¯`•♥Cảnh báo♥•´¯) ๑۩۞۩๑♥
Hãy luôn đảm bảo rằng nội dung bài viết của bạn đáp ứng nội quy của forum
BQT forum có quyền loại bỏ bài viết cũng như người vi phạm mà không cần báo trước...
  
Permissions of this forum:Bạn không có quyền trả lời bài viết
Diễn đàn sinh viên Tĩnh gia 3 :: TRỤ SỞ CHÍNH :: Thông báo-
| CÔNG CỤ TÌM KIẾM | TÌM KIẾM THEO| Tìm kiếm nâng cao...
Múi giờ GMT+7. Hôm nay: Sun Sep 29, 2024 3:53 am

Powered by phpBB2
Copyright ©2011-2012, Forumotion.
Forumotion_ripped by ligerv edit kent

 Free forum | ©phpBB | Free forum support | Báo cáo lạm dụng | Thảo luận mới nhất