Živá ukázka

Výsledek

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Earum, qui dolore facilis doloribus unde quos distinctio reprehenderit ipsa similique pariatur tempore assumenda sit asperiores possimus tenetur. Tempore, nulla placeat neque!
Magni, pariatur, labore voluptate impedit blanditiis tempora beatae sequi illum fugiat error architecto expedita ipsa? Ipsam, dolore, explicabo modi maiores similique eius non expedita ex nesciunt asperiores laborum cumque ducimus!
Debitis, eos, dolorum, reiciendis, quidem mollitia excepturi dicta qui itaque nemo eaque aperiam libero placeat recusandae consequatur aut fugit perspiciatis vero ullam sapiente soluta neque culpa tenetur minus corporis ipsum.
Libero, doloribus in itaque reiciendis quibusdam non. Eligendi, repellendus nostrum omnis iusto fugiat quae ad modi aspernatur molestiae ratione? Qui temporibus ex et beatae veniam illo modi quis eos inventore!
Natus, magni expedita ad vitae sed dignissimos sint quae optio. Culpa, consequuntur perferendis eligendi optio ratione nulla nihil. Nulla odit corporis nesciunt doloribus earum sequi quaerat commodi quam quis beatae!
Alias, quo, quae, tempora excepturi soluta necessitatibus illo mollitia libero tenetur accusamus incidunt in voluptatem eius enim tempore eveniet provident maxime sint doloribus fuga quas suscipit animi nemo quaerat magni.
Eligendi, illo aut nulla fugiat fuga repudiandae animi ipsa reiciendis eos ut magnam voluptates qui a labore ab reprehenderit deleniti. Enim, soluta, officia. Assumenda, veritatis illum recusandae doloribus fuga quae!
Inventore, possimus, quaerat, ipsum ducimus ipsa eum rem dolorem iusto at quae sint a odio tenetur deleniti harum doloribus omnis odit dolorum voluptatum labore enim. Repellat, ipsum praesentium aut dolor?
Sequi, itaque blanditiis officiis deserunt ab odit aspernatur. Ea, veritatis, commodi, perferendis nobis tempore nulla eligendi nesciunt sequi molestiae voluptate doloremque modi accusantium repudiandae omnis sit unde sapiente? Beatae, quos.
Hic, odit, adipisci, atque ut earum blanditiis dolores quam quisquam eius ullam placeat modi nisi iusto numquam optio autem pariatur at. Maxime, tenetur quod molestias vero quas totam temporibus magni.
Text

HTML

Autoformát
Standardní režim
Mobilní zobrazení

CSS

Autoformát
CSS reset
Až na konci

var Tooltip = function() {
    var elements;
    var ttEl;
    var activeTt;
    var timer;
    
    var init = function() {
        elements = document.querySelectorAll("[title]");
        ttEl = document.createElement("div");
        ttEl.className = "tooltip";
        document.body.appendChild(ttEl);

for (var i = 0; i < elements.length; i++) {
 var el = elements[i];
 el.setAttribute("data-title", el.title);
 el.removeAttribute("title");
 el.onmouseover = show;
 el.onmouseout = hide;
 } 
 };

Tooltip.init();

JS

Autoformát
jQuery
Umístění JS