O simplă pictogramă cu suport pentru html-tags pe jquery-paphnut-blog

Pentru mult timp nu am scris nimic pe site, dar am decis să împărtășesc cu oamenii, recent descoperit, cel mai interesant plugin pe jQuery.

1. În primul rând, creați un dosar cu curent js șablon de subfoldere - o fac pentru comoditatea, să nu fie confundate în cazul în care să arunce o JavaScript în viitor.






Nu uitați să copiați fișierul .htaccess în folderul js, de exemplu din folderul css, altfel DLE nu va încărca javascriptul.

2. În mod convenabil pentru dvs., conectăm biblioteca jQuery:
- Sau vom umple fișierul jquery din arhiva atașată în folderul js și scrie mai înainte în main.tpl
- Sau "spunem" motorul astfel încât să "ia" biblioteca cu googlecode:
Noi scriem înainte în main.tpl

3. Descărcați pluginul tooltip.js în folderul js și sub liniile unde este scrisă conexiunea bibliotecii:

Acum, toate legăturile care au clasa Http_link atunci când titlul este încărcat vor fi procesate de plugin și vor avea un sfat util.

4. Definiti clasa pentru tooltip-ul nostru:
În orice fișier CSS scriem:


5. HTML:
De exemplu, luați această bucată de cod:


Acesta conține tag-uri populare de formatare a textului HTML și o imagine. După cum puteți vedea, totul este afișat corect.







Avantajele acestui plugin:
- suport pentru etichetele HTML.
- reglare ușoară.
- utilizare multiplă pe o singură pagină.
- plug-in greutate redusă.

Dar există o muscă în unguent:
Dacă dorești brusc să folosești acest sfat pentru conținutul știrilor - te grăbesc să dezamăgesc, dacă brusc o copie redusă a imaginii apare în știri Cu probabilitatea de 99,9%, toate șabloanele tale vor pluti, așa că voi fi recunoscător pentru cineva care poate ajuta la rezolvarea acestui jamb. Ei bine, dacă nu există poze în știri, atunci este sigur să scrieți așa:

acest lucru poate fi folosit, de exemplu, în loc de o sugestie pentru css, pentru afișarea de știri în 2 coloane.

Cred că toată lumea pentru sine va decide cum să aplice acest tip de instrument pe site-ul său.

1. Pentru a elimina eroarea cu apariția spațiului gol în partea de jos a site-ului la aproximativ 20px, adăugați o poziție verticală negativă în clasa tooltip (sus: -9999px;). Ca rezultat, codul nostru css va arata astfel:

2. Pentru a elimina eroarea cu titlul gol al link-ului, vom corecta ușor codul jquery, adăugăm următoarea linie:

Ca rezultat, scriptul nostru va arata mai mult de 2 linii, dar va functiona mai bine:

Materiale conexe

  • Cinemamir.com 2
    „>
  • O cota mică cu oamenii
    Am decis să împărtășesc cu masele șablonul pe care l-am avut pe blog înainte de actualizare. Cine are nevoie ... ">
  • Fragmente de duminică №2
    Astăzi în selecție există mai multe fragmente pe jQuery. Primul va ajuta la afișarea unui element aleatoriu când ... ">
  • Module Latest Comments 3.4 jQuery ediție
    Acest post am decis să deschid o nouă secțiune Module pentru DLE. O voi posta cât de departe posibil ... ">

feedback-ul







Trimiteți-le prietenilor: