Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
Legea 18/1968 Se mai aplica?

Digi conectare 2 routere prin fir

Succesiune notar versus instanta ...

Montaj aer conditionat in balcon ...
 Cont curent mulți valuta far...

Sugestii plan casa

Experiente cu firme care cumpara ...

joc idem Half Life gratis
 PC game stream catre Nvidia Shiel...

Pompa de apa HEPU ?!

Vreau o masina electrica de tocat...

Cum ajunge remorca de tir inapoi ...
 Alt "Utilizator nou" pe T...

ULBS INFORMATICA

Index preturi

Boxa membrana tweeter infundata
 

Css3 hover delay

- - - - -
Last Updated: Sep 04 2012 22:28, Started by life190 , Jun 28 2012 22:45  
  ·  
  • Please log in to reply
10 replies to this topic

#1
life190
Posted 28 June 2012 - 22:45

life190

    Junior Member

  • Grup: Members
  • Posts: 132
  • Înscris: 13.02.2012
Salut. Am un div care cu ajutorul unui :hover ii schimb backgound image. As vrea sa fac cu css3 ca aceasta schimbare intre backgound-uri sa se faca cu un fade. nu gasesc nimic pe net care sa mearga. Multumesc!

#2
Tiberiu_Alexander
Posted 28 June 2012 - 22:56

Tiberiu_Alexander

    Member

  • Grup: Members
  • Posts: 338
  • Înscris: 05.01.2010
Backgroundul este o imagine, un gradient sau doar o culoare?

Edited by Tiberiu_Alexander, 28 June 2012 - 22:58.

#3
life190
Posted 28 June 2012 - 23:14

life190

    Junior Member

  • Grup: Members
  • Posts: 132
  • Înscris: 13.02.2012

View PostTiberiu_Alexander, on 28th June 2012, 23:56, said:

Backgroundul este o imagine, un gradient sau doar o culoare?
imagine, png

#4
Tiberiu_Alexander
Posted 28 June 2012 - 23:30

Tiberiu_Alexander

    Member

  • Grup: Members
  • Posts: 338
  • Înscris: 05.01.2010

View Postlife190, on 29th June 2012, 00:14, said:

imagine, png

Atunci tranzițiile CSS3 nu cred că vor funcționa pentru un efect de fade.

Edited by Tiberiu_Alexander, 28 June 2012 - 23:42.

#5
life190
Posted 28 June 2012 - 23:44

life190

    Junior Member

  • Grup: Members
  • Posts: 132
  • Înscris: 13.02.2012
Atunci cu jquery cum as putea face?
Am ceva gen asa:
.clasa{background-image:imagine.png}
.clasa:hover{background-image:imagine1.png}
Merge dar vreau cu un fade.

#6
trackback
Posted 29 June 2012 - 01:28

trackback

    Active Member

  • Grup: Members
  • Posts: 1,394
  • Înscris: 04.08.2011
Cu jQuery.
<div id="parent">
		<div class="background first">

		</div>
</div>
In exemplul de mai sus, div-ul .background este cel la care doresti sa faci fadeIn.
Acesta face parte din 2 clase cel putin. Clasa 1: background, si clasa 2: first sau second, fiecare cu background-image diferit.

Procedezi asa la hover (cu jquery):
1. Dai fadeOut() sau hide() la div.background
2. Ii stergi clasa .first ( adica ii inlaturi imaginea de background )
3. Ii adaugi clasa .second ( adica ii atribui noua imagine de background )
4. Ii dai fadeIn()

#7
tracius01
Posted 29 June 2012 - 01:49

tracius01

    Active Member

  • Grup: Members
  • Posts: 1,339
  • Înscris: 11.11.2007
http://css3.bradshaw...ises.com/cfimg/

#8
life190
Posted 03 July 2012 - 17:27

life190

    Junior Member

  • Grup: Members
  • Posts: 132
  • Înscris: 13.02.2012
Faza e ca nu am acces la div ci doar la clase... Sunt facute cu jquery.. deci as vreas fac cum arata link-ul de mai sus dar am acces doar la clase.Cum fac asta?

View Posttrackback, on 29th June 2012, 02:28, said:

Cu jQuery.
<div id="parent">
		<div class="background first">

		</div>
</div>
In exemplul de mai sus, div-ul .background este cel la care doresti sa faci fadeIn.
Acesta face parte din 2 clase cel putin. Clasa 1: background, si clasa 2: first sau second, fiecare cu background-image diferit.

Procedezi asa la hover (cu jquery):
1. Dai fadeOut() sau hide() la div.background
2. Ii stergi clasa .first ( adica ii inlaturi imaginea de background )
3. Ii adaugi clasa .second ( adica ii atribui noua imagine de background )
4. Ii dai fadeIn()
Poti sa imi arati codul te rog frumos, ca nu imi iese...:(

#9
yoshumi
Posted 03 July 2012 - 20:04

yoshumi

    Junior Member

  • Grup: Members
  • Posts: 151
  • Înscris: 27.02.2009
Pai nu e greu.
Ai doua imagini acolo una peste cealalta si tu cand dai hover peste o imagine ii face opacitatea 0 si la cealalta foloseste efectele din trazitie depinzand de browser.
Problema ar fi ca nu cred ca toate versiunile de browser ar suporta asta.

#10
life190
Posted 03 July 2012 - 20:31

life190

    Junior Member

  • Grup: Members
  • Posts: 132
  • Înscris: 13.02.2012

View Postyoshumi, on 3rd July 2012, 21:04, said:

Pai nu e greu.
Ai doua imagini acolo una peste cealalta si tu cand dai hover peste o imagine ii face opacitatea 0 si la cealalta foloseste efectele din trazitie depinzand de browser.
Problema ar fi ca nu cred ca toate versiunile de browser ar suporta asta.
pai pot pune o imagine una peste alta doar din css?

#11
oSerX
Posted 04 September 2012 - 22:28

oSerX

    Active Member

  • Grup: Members
  • Posts: 1,033
  • Înscris: 23.06.2006
poti pune imagine una peste alta cu position:fixed; top:x, left:y sau chiar cu position:absolute; ... depinde ce vrei sa faci acolo ... si folosesti z-index ca sa definesti ce imagine sa fie deasupra.

Anunturi

Second Opinion Second Opinion

Folosind serviciul second opinion ne puteți trimite RMN-uri, CT -uri, angiografii, fișiere .pdf, documente medicale.

Astfel vă vom putea da o opinie neurochirurgicală, fără ca aceasta să poată înlocui un consult de specialitate. Răspunsurile vor fi date prin e-mail în cel mai scurt timp posibil (de obicei în mai putin de 24 de ore, dar nu mai mult de 48 de ore). Second opinion – Neurohope este un serviciu gratuit.

www.neurohope.ro
Back to Markup Languages

▶ 0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

  1. Forumul Softpedia
  2. → Professional Zone
  3. → Programming
  4. → Markup Languages
Forumul Softpedia foloseste "cookies" pentru a imbunatati experienta utilizatorilor Accept
Pentru detalii si optiuni legate de cookies si datele personale, consultati Politica de utilizare cookies si Politica de confidentialitate