• 0

WordPress/jQuery fade out link


Question

http://www.romabio.com/products/biocalce-a/

 

Above is a link to the example. There are two links one is MSDS and the other is TDS. Those link are PDF documents so that the painters/user can get to keep it if they don't want to go back to the website. I have it working fine in WordPress. The only problem is that my boss does not have all the files yet to be uploaded. I want to fade out or hide the link so that users can't link on it or show that it's not available at this time. I know it can be down with jQuery which see if there is an PDF file to show it and if not then hide it. Can anyone help me with it. Thanks!

Link to comment
https://www.neowin.net/forum/topic/1167549-wordpressjquery-fade-out-link/
Share on other sites

14 answers to this question

Recommended Posts

  • 0

She this work?

$(".download-Wrap a").each(function(){
    var match = this.href.match(/\.([a-zA-Z0-9]{2,4})([#;\?]|$)/);
    console.log(match);
    if(match){
        $(this).addClass("linkIcon" + match[1]);
    }
});
  • 0

With PHP you could read all of the filenames from a directory, then compare them to an array of files you've saved (the final, total accumulation of files). If the PDF has yet to be uploaded, you could add a class and then style that with CSS.

 

In the browser, using buttons, you can just do this:

$('#linkId')
    .addClass('deactivated')
    .click(function(e){
        if($(this).hasClass('deactivated')){
            e.preventDefault();
        }
    });
  • 0
  On 29/07/2013 at 19:23, threetonesun said:

 

With PHP you could read all of the filenames from a directory, then compare them to an array of files you've saved (the final, total accumulation of files). If the PDF has yet to be uploaded, you could add a class and then style that with CSS.

 

In the browser, using buttons, you can just do this:

$('#linkId')
    .addClass('deactivated')
    .click(function(e){
        if($(this).hasClass('deactivated')){
            e.preventDefault();
        }
    });

 

Not really good at jQuery coding yet. Is there a way to tell jQuery that when it does not see an PDF file to add a class?

  • 0
  On 29/07/2013 at 19:54, ACTIONpack said:

Not really good at jQuery coding yet. Is there a way to tell jQuery that when it does not see an PDF file to add a class?

 

Not easily, no. You're asking it to load the page, load the script, then check for a file on the server, then report back and modify a page element. It can be done (via ajax, in jQuery), but whether or not it's worth it when you already know if the file exists or doesn't exist is a different question.

  • 0
  On 29/07/2013 at 19:58, threetonesun said:

Not easily, no. You're asking it to load the page, load the script, then check for a file on the server, then report back and modify a page element. It can be done (via ajax, in jQuery), but whether or not it's worth it when you already know if the file exists or doesn't exist is a different question.

 

http://stackoverflow.com/questions/15879130/jquery-add-class-to-href-if-link-contains-specific-text

 

The link above is something I want it to do but instead of adding a class when seeing the .pd. I want to add a class when no .pdf file is there.

  • 0
  On 29/07/2013 at 20:01, ACTIONpack said:

http://stackoverflow.com/questions/15879130/jquery-add-class-to-href-if-link-contains-specific-text

 

The link above is something I want it to do but instead of adding a class when seeing the .pd. I want to add a class when no .pdf file is there.

 

Well, you can have a link that points nowhere (a href="" or a href="placeholder") then check for an empty string, and for any link that matches, add a class.

  • 0
  On 29/07/2013 at 20:09, threetonesun said:

Well, you can have a link that points nowhere (a href="" or a href="placeholder") then check for an empty string, and for any link that matches, add a class.

 

Would it be easier to add a class when it see a PDF and I can't make it visible instead of when there is no PDF to add a Class?

  • 0
  On 29/07/2013 at 20:23, ACTIONpack said:

Would it be easier to add a class when it see a PDF and I can't make it visible instead of when there is no PDF to add a Class?

 

No :laugh:

 

You're talking about two situations here, I think. If you have something like this:

<a href="/pdfs/pdfthatexists.pdf">Click here for PDF!</a>
<a href="nowhere">Don't click here, there's no PDF!</a>

Then it's relatively trivial to add a class to any of these links, just by selecting through the href attribute. If you have this:

<a href="/pdfs/pdfthatexists1.pdf">Click here for PDF!</a>

<a href="/pdfs/pdfthatexists2.pdf">This PDF may or may not be on the server!</a>
<a href="/pdfs/pdfthatexists3.pdf">This PDF may or may not be on the server!</a>

Then it would be easier to check for the file and add a class via PHP. Otherwise you have to resort to ajax/http requests in javascript.

 

It's possible we're misunderstanding each other, though, just let me know. :D

  • 0
  On 29/07/2013 at 20:30, threetonesun said:

No :laugh:

 

You're talking about two situations here, I think. If you have something like this:

<a href="/pdfs/pdfthatexists.pdf">Click here for PDF!</a>
<a href="nowhere">Don't click here, there's no PDF!</a>

Then it's relatively trivial to add a class to any of these links, just by selecting through the href attribute. If you have this:

<a href="/pdfs/pdfthatexists1.pdf">Click here for PDF!</a>

<a href="/pdfs/pdfthatexists2.pdf">This PDF may or may not be on the server!</a>
<a href="/pdfs/pdfthatexists3.pdf">This PDF may or may not be on the server!</a>

Then it would be easier to check for the file and add a class via PHP. Otherwise you have to resort to ajax/http requests in javascript.

 

It's possible we're misunderstanding each other, though, just let me know. :D

 

Yea, forget about me using PHP/WordPress. Lets say that I'm doing it in HTML, CSS3 and jQuery only. Is there a way that I can tell jQuery if there is a PDF file or any general file on the link to add a class to it?

  • 0
  On 29/07/2013 at 20:49, ACTIONpack said:

Yea, forget about me using PHP/WordPress. Lets say that I'm doing it in HTML, CSS3 and jQuery only. Is there a way that I can tell jQuery if there is a PDF file or any general file on the link to add a class to it?

 

Like this: http://jsfiddle.net/pNRfk/

 

Again, if you need to create the links first, and then check if the file actually exists on the server only using jQuery, it gets trickier.

  • 0

This might be clearer: http://jsfiddle.net/pNRfk/3/

var $links = $('a');
$links.each(function(){
    var link = $(this).attr('href');
    var css = link.indexOf('.pdf') > -1 ? 'active' : 'notActive';
    $(this).children('button').addClass(css);
});

$('.notActive').on('click',function(e){
    e.preventDefault();
})
  • 0

The last post I provided jQuery code and it does work find. I just have to make the class look non active and when it does see a .pdf file, I just active the linkIconpdf. Have to add the pdf to the end of linIcon if I'm going to get the code to work.

 

Thanks everyone for helping me out.

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Posts

    • Lmao. Cries about not playing those games not installed and yet don't ever want to touch them.
    • If I want to merge folder trees that have a similar structure, Beyond Compare is always my first choice. It's not free but it's awesome. If I want to just scan a whole drive/folder and find duplicates that are taking up space, I like Czkawka.
    • Claude Code gets throttled as Anthropic rolls out fresh usage caps by David Uzondu Claude Code, the AI-in-terminal utility developed by Anthropic and launched back in February, is getting updated usage limits following weeks of user complaints about being abruptly cut off. Many developers on the "$200/month Max plan" found their access blocked after just a few requests, with no explanation from the company. In a recent thread posted to X, the AI lab explained that it has seen "unprecedented demand since launch," pointing to some of its heaviest users who were running the tool continuously in the background 24/7, with one person reportedly consuming tens of thousands of dollars in model usage on a single $200 subscription. Anthropic also claimed that some users were violating its usage policy by sharing and reselling accounts, which impacts system capacity for everyone. These factors all led the company to announce new weekly limits that will be added on top of the existing five-hour caps, effective August 28. Max plan subscribers will have the option to buy additional usage at standard API rates if they hit their cap. Here's what the new weekly limits look like: Pro Plan ($20/month): An estimated 40 to 80 hours of usage with the Sonnet 4 model. Max Plan ($100/month): An estimated 140 to 280 hours with Sonnet 4 and 15 to 35 hours with the top-tier Opus 4 model. Max Plan ($200/month): An estimated 240 to 480 hours with Sonnet 4 and 24 to 40 hours with Opus 4. Per TechCrunch, the company provided these hour-based estimates, noting that the actual numbers may vary based on the size of a project's codebase. What's interesting is how this new structure compares to the old marketing. Anthropic previously advertised its $200 Max plan as offering 20 times more usage than the Pro plan. Based on these new hourly estimates, that multiple is now closer to six. It is possible the 20x figure still applies when measured in tokens or raw compute, but, according to TechCrunch, the company has not clarified that point.
    • I don't give a rat's f### what Trumpette, the Putin puppet likes!
  • Recent Achievements

    • First Post
      Gladiattore earned a badge
      First Post
    • Reacting Well
      Gladiattore earned a badge
      Reacting Well
    • Week One Done
      NeoWeen earned a badge
      Week One Done
    • One Month Later
      BA the Curmudgeon earned a badge
      One Month Later
    • First Post
      Doreen768 earned a badge
      First Post
  • Popular Contributors

    1. 1
      +primortal
      642
    2. 2
      ATLien_0
      260
    3. 3
      Xenon
      165
    4. 4
      neufuse
      142
    5. 5
      +FloatingFatMan
      107
  • Tell a friend

    Love Neowin? Tell a friend!