I think you didn't check well, I removed comments and line breaks for
my own clarity, but you were using each and repeating $(this) and that
was unnecesary.
Ariel Flesler
Nazgulled wrote:
> I was looking for something more like this and not like your previous
> post (remove comments, line-breaks, I know how to do that lol...)
>
> On Feb 15, 6:36 pm, Ariel Flesler <[EMAIL PROTECTED]> wrote:
> > Also you could add something like:
> >
> > function getFn( color ){
> > return function(){
> > $(this).stop().animate({ color:linkColors[color] },150};
> > };
> >
> > };
> >
> > And then: $('#cpblock-links a').css('color',
> > linkColors[0] ).hover( getFn(1), getFn(0) );
> >
> > Ariel Flesler
> >
> > On 15 feb, 16:32, Ariel Flesler <[EMAIL PROTECTED]> wrote:
> >
> > > function enableFadingLinks() {
> > > var linkColors = getColorsFromCSS('links');
> > > if ( !linkColors) return;
> > > $('#cpblock-links a').css('color', linkColors[0] ).hover(
> > > function(){
> > > $(this).stop().animate({ color: linkColors[1] },
> > > 150);
> > > },
> > > function(){
> > > $(this).stop().animate({ color: linkColors[0] },
> > > 150);
> > > }
> > > );
> > > $('#content a').css('color', linkColors[2] ).hover(
> > > function(){
> > > $(this).stop().animate({ color: linkColors[3] },
> > > 150);
> > > },
> > > function(){
> > > $(this).stop().animate({ color: linkColors[2] },
> > > 150);
> > > }
> > > );
> >
> > > };
> >
> > > You can also avoid repeating first and second part with some wicked
> > > check, like adding a class to all of them and doing like:
> > > var color = linkColors[ $(this).is('.cp-block') ? 1 : 2 ];
> > > That's just an example, not using logic numbers.
> >
> > > Remember.. chain, chain, chain.
> >
> > > Hope that helps
> >
> > > Ariel Flesler
> >
> > > On 15 feb, 15:48, Nazgulled <[EMAIL PROTECTED]> wrote:
> >
> > > > Hi,
> > > > I have this code that animates links when you move the mouse over/out
> > > > using the hover() but the thing is: the page does not have always the
> > > > same link colors. For instance, some parts of the webpage has links
> > > > that have color A and B (a:link and a:hover respectively) some other
> > > > parts have links of color C and color D (a:link and a:hover
> > > > respectively) and in the future I might need some other website parts
> > > > to have even more different colors, currently, I only have these 2.
> >
> > > > And the code for all that is as follows:
> >
> > > > /**
> > > > * Adds a fade effect to links on mouse hover
> > > > */
> > > > function enableFadingLinks() {
> > > > // Get the link colors from the external CSS file
> > > > var linkColors = getColorsFromCSS('links');
> >
> > > > // Double check if the colors were retrieved
> > > > if (linkColors) {
> > > > // Function hook to each 'a' element found on the
> > > > specific ID
> > > > $('div#cpblock-links a').each(function(){
> > > > // Little bug fix for first mouseover
> > > > $(this).css({
> > > > color: linkColors[0]
> > > > });
> >
> > > > // Function hooks to the hover event of the 'a'
> > > > element
> > > > $(this).hover(
> > > > function() {
> > > > $(this).stop();
> > > > $(this).animate({ color:
> > > > linkColors[1] }, 150);
> > > > },
> > > > function() {
> > > > $(this).stop();
> > > > $(this).animate({ color:
> > > > linkColors[0] }, 150);
> > > > }
> > > > );
> > > > });
> >
> > > > // Function hook to each 'a' element found on the
> > > > specific ID
> > > > $('div#content a').each(function(){
> > > > // Little bug fix for first mouseover
> > > > $(this).css({
> > > > color: linkColors[2]
> > > > });
> >
> > > > // Function hooks to the hover event of the 'a'
> > > > element
> > > > $(this).hover(
> > > > function() {
> > > > $(this).stop();
> > > > $(this).animate({ color:
> > > > linkColors[3] }, 150);
> > > > },
> > > > function() {
> > > > $(this).stop();
> > > > $(this).animate({ color:
> > > > linkColors[2] }, 150);
> > > > }
> > > > );
> > > > });
> > > > }
> >
> > > > }
> >
> > > > As you can see, there's a bunch of code that I repeat and the only
> > > > differences are the colors that I pass to the code that depend on what
> > > > links we are animating. I'm looking for a way to compact this code, to
> > > > make it smaller (less lines of code).
> >
> > > > Do you have any suggestions?
> >
> > > > P.S.: Just in case you need to know, I'm using the color plugin to be
> > > > able to animate the color properties of the elemnts.
> >
> > > > P.S.2.: Also, if you know of a better a way to have color fading
> > > > links, let me know... I've already wasted lots of times in this little
> > > > link effect and I've only come up with this result.- Ocultar texto de
> > > > la cita -
> >
> > > - Mostrar texto de la cita -
