Jump to content


Photo

Jquery.. Why is ths not working?

jquery images automatic insertion of icons

  • Please log in to reply
2 replies to this topic

#1 danny_woo

danny_woo

    Member

  • Members
  • PipPip
  • 23 posts

Posted 10 May 2013 - 07:50 PM

Hi guys,

 

I am currently going through the Lynda Learning Jquery Essential training course. I have completed all the lessons in the first chapter however on the last lasson in the chapter that puts everything together in a practical example I cant get it to work properly. This is really anoying as i have spent all my free time this week studying.

 

Anyway, the lesson/code should work like this, display a small PDF icon next to every href element in the document the has the .pdf extension.

 

However when i preveiw the code below none of the pdf images are displayed.

 

This is the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Automatic PDF Icons</title>
<style type="text/css">
li {
	margin: 5pt 0 0 5pt;
}
</style>
<script type="text/javascript" src="js/jquery-1.9.1.js"></script>
<script type="text/javascript">
    $("document").ready(function() {
        $("a[href$=.pdf]").after("<img src='images/small_pdf_icon.gif' align='absbottom' />");
    });
</script>
</head>
<body>
<h1>Example: Automatic Insertion of Icons for PDF Links</h1>
<p>This example demonstrates how to examine the contents of a link to see if it points to a
PDF file and automatically insert a PDF icon if it does.</p>
<ul class="navlist" id="navlinks">
	<li><a href="someurl.html">Link #1</a></li>
	<li><a name="#anchor1">Named Anchor Link</a></li>
	<li><a href="someurl.html">Link #2</a></li>
	<li><a href="someurl.pdf">Link #3</a></li>
	<li><a href="someurl.html">Link #4</a></li>
	<li><a href="someurl.html">Link #5</a></li>
	<li><a href="someurl.pdf">Link #6</a></li>
	<li><a href="someurl.html">Link #7</a></li>
	<li><a href="mailto:joe@joe.com">Email Link</a></li>
</ul>
</body>
</html>

Hope you guys can help me out on this one, I was really enjoying learning Jquery up until now.

 

Many thanks in advance.

 



#2 Xaotique

Xaotique

    Advanced Member

  • Members
  • PipPipPip
  • 567 posts
  • LocationPennsylvania, United States
  • Age:22

Posted 11 May 2013 - 02:15 PM

Quote your comparison, so it's: $("a[href$='.pdf']")


Edited by Xaotique, 11 May 2013 - 02:15 PM.


#3 Irate

Irate

    Advanced Member

  • Members
  • PipPipPip
  • 358 posts
  • LocationHamburg, Germany
  • Age:17

Posted 11 May 2013 - 11:39 PM

You are sure that you are using your code in a working surrounding and that the jquery-1.9.1.js file actually exists?
Quod placet mihi non placeat tibi. - What I think to be good must not always equal your perception of it.

I am not perfect. I try a lot with the code I provide and I don't guarantee for it to work as I have mostly no option to test it on my mobile phone. I do apologize for any inconvenience I caused, but if I do happen to have helped, liking my posts or marking them as to have solved or answered your question would be nice.




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Cheap Linux VPS from $5
SSD Storage, 30 day Guarantee
1 TB of BW, 100% Network Uptime

AlphaBit.com