Descriere:
Există o mulţime de tutoriale referitoare la tooltip plugin-uri ,dar din pacate multe dintre ele ori nu sunt bine explicate ori sunt in ingleza si nu pot fi intelese de toata lumea,de aceia eu m-am deci sa fac acest tutoria si sa va explic mai amanuntit despre ce este vorba.
Demonstratie: Click
CSS:
Pentru inceput trebuie sa adaugam codul urmator in CSS.
Panou de administrare > Afisare > Imagini si culori > Culori > Foaie de stil CSS >Valideaza
jQuery :
Codul jQuery il puteti adauga ori unde doriti dumneavoastra pe forum , eu am sa va dau un mic exemplu.
Panou de administrare > Afisare > Template-uri > General > overall_header >si adaugati codul dupa
Codul jQuery :
Imformatii:
Unde vedeti
LINK-treceti adresa dorita de dumneavoastra.
IMAGINEA NR:1-Adaugati prima imagine
IMAGINEA NR:2-Adaugati ce-a dea 2 imagine
Există o mulţime de tutoriale referitoare la tooltip plugin-uri ,dar din pacate multe dintre ele ori nu sunt bine explicate ori sunt in ingleza si nu pot fi intelese de toata lumea,de aceia eu m-am deci sa fac acest tutoria si sa va explic mai amanuntit despre ce este vorba.
Demonstratie: Click
CSS:
Pentru inceput trebuie sa adaugam codul urmator in CSS.
Panou de administrare > Afisare > Imagini si culori > Culori > Foaie de stil CSS >Valideaza
- Cod:
.tip {
color: #fff;
background:#1d1d1d;
display:none;
padding:10px;
position:absolute;z-index:1000;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;}
.container {
width: 960px;
margin: 0 auto;
overflow: hidden;}
jQuery :
Codul jQuery il puteti adauga ori unde doriti dumneavoastra pe forum , eu am sa va dau un mic exemplu.
Panou de administrare > Afisare > Template-uri > General > overall_header >si adaugati codul dupa
- Cod:
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">
Codul jQuery :
- Cod:
<script type="text/javascript" src="http://emanueltutorials.webs.com/Tooltip%20jQuery.js"></script>
<script type="text/javascript" src="http://emanueltutorials.webs.com/Tooltip.js"></script>
<div class="container">
<a href=" LINK " target="_blank"class="tip_trigger">
<img src=" IMAGINEA NR:1 " >
<span class="tip">
<img src=" IMAGINEA NR:2 ">
</span></a>
Imformatii:
Unde vedeti
LINK-treceti adresa dorita de dumneavoastra.
IMAGINEA NR:1-Adaugati prima imagine
IMAGINEA NR:2-Adaugati ce-a dea 2 imagine