jQuery hover

#1
cmedia

Posted 10 June 2015 - 20:16

Junior Member

Grup: Members
Posts: 239
Înscris: 03.09.2009

Buna! Am un cod care imi afiseaza niste imagini rand pe rand setand opacitatea la 0.7 de la 0. Stie cineva cum pot sa fac ca atunci cand trec cu mouse-ul peste imagine sa aiba opacitate de 1?
Aici am codul:

$('.page-wrap .portfolio-item').each(function(i){
	 $(this).delay(i*300).animate({
				 opacity: 0.7
		 },300);
});

Back to top

#2
MooF2010

Posted 10 June 2015 - 20:21

Senior Member

Grup: Senior Members
Posts: 5,371
Înscris: 24.05.2010

css? on-hover sau ceva de genul

Back to top

#3
cmedia

Posted 10 June 2015 - 20:30

Junior Member

Grup: Members
Posts: 239
Înscris: 03.09.2009

Avand functia asta hover-ul in css se pare ca nu merge.

Edited by cmedia, 10 June 2015 - 20:30.

Back to top

#4
Demon000

Posted 10 June 2015 - 20:30

Lone wanderer

Grup: Senior Members
Posts: 2,372
Înscris: 09.01.2015

cmedia, on 10 iunie 2015 - 20:16, said:

Buna! Am un cod care imi afiseaza niste imagini rand pe rand setand opacitatea la 0.7 de la 0. Stie cineva cum pot sa fac ca atunci cand trec cu mouse-ul peste imagine sa aiba opacitate de 1?
Aici am codul:

$('.page-wrap .portfolio-item').each(function(i){
	 $(this).delay(i*300).animate({
				 opacity: 0.7
		 },300);
});

.page-wrap .portofolio-item:hover
{
opacity:1;
}
Inainte sa te apuci de jQuery si portofoliu, invata CSS si Javascript. Ca fapt divers, sunt multi web designeri care invata jQuery inainte de Javascript, ceea ce mi se pare infect.
Si poti face si "fade-ul" in CSS.

Edited by Demon000, 10 June 2015 - 20:33.

Back to top

#5
cmedia

Posted 10 June 2015 - 20:32

Junior Member

Grup: Members
Posts: 239
Înscris: 03.09.2009

Demon000, on 10 iunie 2015 - 20:30, said:

.page-wrap .portofolio-item:hover
{
opacity:1;
}
Inainte sa te apuci de jQuery si portofoliu, invata CSS.

Prietene, de unde deduci tu ca nu stiu CSS? Ei..uite ca stiu. Avand functia asta in .js, practic hover-ul din css e inutil.

Edited by cmedia, 10 June 2015 - 20:33.

Back to top

#6
cristirg

Posted 10 June 2015 - 20:35

Senior Member

Grup: Senior Members
Posts: 7,711
Înscris: 16.11.2012

-poti sa faci doar cu css3
-pui la poza:{transition: all 0.3s ease-in-out;opacity: 0.7;}

-si la poza:hover : opacity: 1;

Back to top

#7
Demon000

Posted 10 June 2015 - 20:35

Lone wanderer

Grup: Senior Members
Posts: 2,372
Înscris: 09.01.2015

cmedia, on 10 iunie 2015 - 20:32, said:

Prietene, de unde deduci tu ca nu stiu CSS? Ei..uite ca stiu. Avand functia asta in .js, practic hover-ul din css e inutil.

Iei o variabila, adaugi un event de hover pe obiectele necesare, care sa schimbe variabila. In script-ul tau de fade testezi variabila sa vezi daca nu cumva e mouse-ul pe obiect. Mare treaba.

Edited by Demon000, 10 June 2015 - 20:36.

Back to top

#8
cmedia

Posted 10 June 2015 - 20:36

Junior Member

Grup: Members
Posts: 239
Înscris: 03.09.2009

Demon000, on 10 iunie 2015 - 20:30, said:

Ca fapt divers, sunt multi web designeri care invata jQuery inainte de Javascript, ceea ce mi se pare infect.

OK. Nu am venit aici pentru lectii despre cum anume sa invat si ce sa fac. Am pus o intrebare la care speram un raspuns la obiect. Forumuri romanesti, nu stiu de ce le mai dau atatea sanse.

Back to top

#9
DILAS

Posted 10 June 2015 - 22:58

Member

Grup: Members
Posts: 320
Înscris: 03.12.2007

cmedia, on 10 iunie 2015 - 20:36, said:

OK. Nu am venit aici pentru lectii despre cum anume sa invat si ce sa fac. Am pus o intrebare la care speram un raspuns la obiect. Forumuri romanesti, nu stiu de ce le mai dau atatea sanse.

Te superi degeaba, omul a zis bine ce a zis. E important sa inveti javascript inainte sa te apuci de jquery, macar the basics.
Si a mai zis o chestie buna, efectele astea se fac mai bine cu css decat jquery, in primul rand din punct de vedere al performantei.

sorinteles, on 10 iunie 2015 - 20:37, said:

Folosind jquery:

$('.page-wrap .portfolio-item').hover(function(i){ $(this).animate({ opacity:1 },300); });

Selectorii de genul $('.numeClasa1 .numeClasa2') sunt foarte slow si e considerat bad practice. E mult mai corect sa faci ceva de genul:

var $numeClasa1 = $('.numeClasa1'); // caching in caz ca se apeleaza elmentul de cel putin 2 ori in metoda respectica
$numeClasa1.find('.numeClasa2').each(function() {//do something})

Back to top

Anunturi

Chirurgia endoscopică a hipofizei

"Standardul de aur" în chirurgia hipofizară îl reprezintă endoscopia transnazală transsfenoidală.

Echipa NeuroHope este antrenată în unul din cele mai mari centre de chirurgie a hipofizei din Europa, Spitalul Foch din Paris, centrul în care a fost introdus pentru prima dată endoscopul în chirurgia transnazală a hipofizei, de către neurochirurgul francez Guiot. Pe lângă tumorile cu origine hipofizară, prin tehnicile endoscopice transnazale pot fi abordate numeroase alte patologii neurochirurgicale.

www.neurohope.ro

jQuery hover

#1 cmedia Posted 10 June 2015 - 20:16

#2 MooF2010 Posted 10 June 2015 - 20:21

#3 cmedia Posted 10 June 2015 - 20:30

#4 Demon000 Posted 10 June 2015 - 20:30

#5 cmedia Posted 10 June 2015 - 20:32

#6 cristirg Posted 10 June 2015 - 20:35

#7 Demon000 Posted 10 June 2015 - 20:35

#8 cmedia Posted 10 June 2015 - 20:36

#9 DILAS Posted 10 June 2015 - 22:58

Anunturi

▶ 0 user(s) are reading this topic

Sign In

#1
cmedia

Posted 10 June 2015 - 20:16

#2
MooF2010

Posted 10 June 2015 - 20:21

#3
cmedia

Posted 10 June 2015 - 20:30

#4
Demon000

Posted 10 June 2015 - 20:30

#5
cmedia

Posted 10 June 2015 - 20:32

#6
cristirg

Posted 10 June 2015 - 20:35

#7
Demon000

Posted 10 June 2015 - 20:35

#8
cmedia

Posted 10 June 2015 - 20:36

#9
DILAS

Posted 10 June 2015 - 22:58