Bogdy
Moderator
Mesaje : 26 Puncte : 69 Reputatie : 1 Data de inscriere : 2011-10-23 Varsta : 32 Localizare : Deva,Jud.Hunedoara
|
|
| Subject: Tooltip jQuery & CSS Sun Dec 04, 2011 11:33 am
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: ClickCSS:Pentru inceput trebuie sa adaugam codul urmator in CSS. Panou de administrare > Afisare > Imagini si culori > Culori > Foaie de stil CSS >Valideaza - Code:
.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 - Code:
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">
Codul jQuery : - Code:
<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>
Imformati:Unde vedetii LINK-treceti adresa dorita de dumneavoastra. IMAGINEA NR:1-Adaugati prima imagine IMAGINEA NR:2-Adaugati ce-a dea 2 imagine
Tutorial realizat de: EmanuelSursa: SOHTANAKA |
| | |
|