• 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

    • Was sort of sceptical about the unload page feature , just tried it and it does actually drop memory usage. 22 tabs open(1.65gb Ram) and after unloading Facebook as a test it dropped to 1.2gb
    • Elon Musk doesn't want you to know Tesla's response to the NHTSA's Robotaxi questions by David Uzondu Recently, Tesla's Robotaxi service began operating in Austin, and almost immediately, the company decided it would prefer you didn't see its homework. Before the launch, the National Highway Traffic Safety Administration (NHTSA) sent Tesla a letter with a deadline of June 19th to answer some questions. Now that Tesla has replied, it has requested that the NHTSA withhold the entire response from the public, classifying it as confidential business information. This isn't too surprising, as the company is notoriously secretive about its performance data, especially in areas like Autopilot and Full Self-Driving. Here are a few paraphrased versions of the questions Tesla faced: How will the system handle bad weather or poor visibility? What happens if the system detects that it cannot drive safely? Does it pull over? Will a human be monitoring the cars remotely or in person? Does the system follow any existing industry standards for autonomous driving? When does Tesla plan to let other people operate their own cars as robotaxis? The feds have good reason to ask. On its first day, Tesla's Robotaxi service was caught on video making some questionable moves, including driving in the wrong lane against traffic, as seen below (full video here). The clip was also shared in our community forums, though you'll need a free membership to access the off-topic section. Here's another showing a Robotaxi dropping passengers in the middle of an intersection. For now, the service runs with a human safety driver (likely a Tesla employee) in the passenger seat. Billionaire Dan O'Dowd, a persistent critic of Tesla's software, felt the company's launch was lackluster, and the videos circulating online demonstrate that the technology is years behind competitors like Waymo, which has operated without in-car supervisors since 2019. For its part, NHTSA acknowledged being aware of the widely reported incidents and is in contact with Tesla to get more information. The agency's statement reminded the public that manufacturers self-certify their vehicles' safety, and NHTSA's role is to investigate and act on safety problems after they are on the road: This situation gets even more interesting when you look at the bigger picture. Musk has already been criticized for his role in the Department of Government Efficiency (DOGE), which has led to job cuts at agencies that oversee his companies, including the Federal Aviation Administration (FAA) for SpaceX, the Food and Drug Administration (FDA) for Neuralink, and, of course, NHTSA. This has led some to worry about regulatory capture. As one cynical comment on Electrek's article notes, the official who signed the letter to Tesla, Tanya Topka, Director of NHTSA's Office of Defects Investigation, may have put a target on her back just for trying to hold the company accountable.
    • Have you ever developed a game for Xbox and Windows at the same time? To say that they are not the same operating system and the same DirecTx by chance?? It's obvious that it isn't, right? So what if Xbox uses HyperV? What difference does that make to a game developer? The PS4 is more different than the PS5, different operating systems and different APIs. The games are not backwards compatible However, a game made in Windows can be transferred to Xbox SX in a few weeks with little programming costs because they are the same API and the same Windows
    • Idiot, FH5 sold more on Xbox and Windows than on PS5. You tell lies like that and think no one will check, right? There are a lot of FIFA and CoD hacks on PS4 and PS5 being used every day and Sony doesn't do anything. You can also buy a game's Platinum achievement without having bought the game and Sony doesn't do anything.
  • Recent Achievements

    • First Post
      956400 earned a badge
      First Post
    • Week One Done
      davidfegan earned a badge
      Week One Done
    • First Post
      Ainajohn earned a badge
      First Post
    • Conversation Starter
      sophiaisabella32 earned a badge
      Conversation Starter
    • First Post
      Brett76 earned a badge
      First Post
  • Popular Contributors

    1. 1
      +primortal
      591
    2. 2
      ATLien_0
      222
    3. 3
      Michael Scrip
      173
    4. 4
      +FloatingFatMan
      146
    5. 5
      Xenon
      133
  • Tell a friend

    Love Neowin? Tell a friend!