• 18-11-2012, 16:17:32
    #1
    Üyeliği durduruldu
    Merhabalar.

    Lazım olabiliyor bazen basitçe yapımı aşağıdadır.Kendim hazırladım..
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    #wrapper {
    	font-family: Arial, Helvetica, sans-serif;
    	font-size: 14px;
    	color: #03F;
    }
    #content:hover li {
    	visibility: visible;
    }
    #yazi li {
    	border: 1px dashed #666;
    	background-color: #CCC;
    	width: 450px;
    	height: 150px;
    	margin-left: -5px;
    
    }
    #yazi {
    	visibility: hidden;
    }
    #yazi ul {
    	list-style-type: none;
    }
    </style>
    </head>
    
    <body>
    <div id="content">
    <div id="wrapper">Mustafa Kemal Atatürk Kimdir ?</div>
    <div id="yazi">
    <ul>
    <li>.<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/6/6a/MustafaKemalAtaturk.jpg/230px-MustafaKemalAtaturk.jpg" width="150" height="150" /></li>
    </ul>
    </div>
    </div>
    </body>
    </html>
  • 20-11-2012, 21:44:31
    #2
    hocam tooltip'i css ile yapmak biraz kod fazlalığı oluyor, jQuery kullanmak daha mantıklı ama bunu kullanıcam derseniz altına üçgen eklemenizi öneririm.
    .ucgen {
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 12px solid #000;
    }