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 -
