Search the Community
Showing results for tags 'automatic insertion of icons'.
-
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.