This problem is the result of IE7 not displaying animated GIF's that are hidden.
for reference:
http://crunchlife.com/articles/2008/06/11/ie7s-inanimate-gif
These 2 solutions involve the use of the setTimeout function and innerHTML. These examples use absolute URL's to the images. Since I'm using JSF, I would like to use relative URL's. Is there a proper way to do this in JSF?
Those examples doesn't use absolute URL's. Your problem lies somewhere else. At least, the URL pointing to the image should be relative to the request URL of the JSF page in question. You can easily check it in the browser's address bar.
A common mistake among starters is namely that they think that it should be relative to the location of the page in the server side folder structure. This is untrue. You should look at the request URL. Determine the absolute request URL of both the JSF page and the image, then you should be able to extract the relative URL to the image from it.
Related
I am using pug as the view engine of a nodejs application. I have a layout that every other current view extends, that contains a navbar with links to common urls across the app.
For example, a link to the signin url would look like :
a(href='/auth/signin')`
This works fine from the root url ('/'), correctly leads to '/auth/signin'.
Within the '/auth' module which contains the routes for '/auth/signin', '/auth/signup' and '/auth/signout', the behavior is different. Instead, the route is concatenated with the current module's name. So for example, within the '/auth/signin' route, the link is actually a link to '/auth/auth/signin'. Clicking on it naturally leads to a 404, but on that page the link to signin is a link to '/auth/auth/auth/signin'.
And so on and so forth.
I don't fully understand what is going on here and how to prevent it. Is there away to link to my routes in absolute terms in pug without straight up typing the full url (which is unpractical for a variety of reasons), the same way you'd use a route helper in Ruby on Rails ?
Solution from the comments:
If you start your href's with a slash then these are interpreted as absolute url's. Then it does not matter in which folder your pug file is located. Please check that your href's start with / always.
Is there a way, to take out the HTML link and provide a favicon or alternatively, not let it be requested - perhaps using .htaccess?
<link rel=icon href=icon>
For instance, when a user opens a [.pdf] or otherwise, there is no icon - displaying 'nothing' or at least it is transparent. The purpose, is to minimise the number of HTTP requests. You see, I do not want to have [the HTML link] at all - so a data URI is not necessarily an option. In other words, I wish to remove this HTML tag - displaying nothing like a [.pdf] file, in the browser.
If you don't have a tag specifying the url of a favicon, most browsers will just send a blind request to www.yourdomain.com/favicon.ico and hope for the best (thanks to w3d for pointing this out). This isn't something you can prevent them from doing.
Although, from what I know, favicons are cached in the clients browser, so they won't even be sending requests for it on every page-load.
I've got an express.js app currently using ejs (using jade for newer projects) and I'm trying to solve a problem in a clean and appropriate manner.
I've got a layout.ejs file with my header and footer in it. Most of my site so far has been one layer deep http://innovationbound.com/about or /services or /amy and so on....
I'm beginning to created online courses at http://innovationbound.com/courses/course-name and the issue I'm having is that these course pages can't reference the images the same way. <img src="images/linknedin.png" alt="LinkedIn Icon"> for instance.
From the course-name page it tries <img src="courses/images/LinkedIn.png" alt="LinkedIn Icon"> and obviously can't grab the image there.
Is there a setting in express, or something obvious I'm missing? I hope I don't have to use absolute urls, that just makes developing on the local machine insane.
Just use site root–relative paths. For example <img src="/images/linknedin.png" alt="LinkedIn Icon">. Note the / makes the difference.
There are three types of link paths:
Absolute paths (such as http://www.adobe.com/support/dreamweaver/contents.html).
Document-relative paths (such as dreamweaver/contents.html).
Site root–relative paths (such as /support/dreamweaver/contents.html).
From Adobe.
You might consider it, but you can use "../images/link(n?)edin.png". However, I'd recommend to use absolute path, because images should be stored in /public (in general jade setup) and your path depth could be varied by your route rule.
As a tip, if you lost in relative path of image, right click on broken image and see a URL in properties on web browser. It'll give you a hint of where the image is.
i updated the code from my website to a 'better' veersion i think,
it works fine but when i try to implement the friendly URL and load it, works, but with no CSS, Javascript or images,
but if i corret the routes for the css to http://website/css/style.css (instead of ./css/style.css) it i do see the CSS properly loaded,
any idea why?
Example: http://keepyourlinks.com/link1.php?id=25 VS http://keepyourlinks.com/keep/25/series-yonkis
(i updated the route of the CSS, but the Javascript is missing an the images asweell)
I really would like not to have to correct al routes :(
./ means the current directory, which isn't where the file is, so it doesn't work.
Your best bet is to start using paths relative to the root of your site from now on, every time you write a link to a stylesheet or javascript or image, on every site. It always works and saves you from problems like this.
/css/style.css points to the same URL no matter what directory the current page is in.
I made the following observation:
If I create an svg image that references an external raster image via xlink:href and try to load the svg in browsers, the external images are only shown if I use the <object> tag, but not when using the <img> tag.
Rendering with the <object> tag is quite slow and not as clean as using the img tag for images so I was wondering if there's a way to make it work through the <img> tag.
At first I thought it doesn't work because of a same origin policy, but even if the referenced image is in the same directory and I reference it through its name only, it wont load.
Any ideas?
Are you using IE? IE doesnt recognize SVG anyway. Microsoft is always ten years behind, yet they are more popular and far more costly, for some reason. Name brand propaganda?
SVG loads in Firefox. Both as an XML document referenced directly in the URL, and also if you embed it into an XHTML (fully XML compliant) document with proper namespacing, the SVG should render properly. The great thing about this option is that DHTML can manipulate your SVG. Everything I said in this paragraph also applies to MathML, if youre curious.
Aside from that, SVG doesn't load from an image tag. I do believe Firefox is working on this upgrade, though. Im not entirely sure.
Using the object or embed tag is reasonable, I suppose... but one of my earlier fixes was to use an iframe. Embed an iframe in your html that references the complete SVG file. Using CSS you can make the iframe look flush with the rest of your document, appearing and acting like an image. Encased in a div or span tag, you can have onhover and onclick event handlers.
Using the image tag, your src can be a PHP file on server side. If properly coded and with the appropriate cgi apps, you can rasterize your SVG on server-side, and have that PNG data sent back to your image via the PHP src.
There's no particular reason <object> should be any slower to load than <img> apart from possibly the interaction aspect (img's are static while object's are fully interactive documents). The images inside the svg should load in both scenarios, so it sounds like a bug in the browser.
Could you post a link to your example?
I think you are at least 10 months behind...IE9 supports SVG, and pre-release versions (including a beta) have been out for quite a while. Check out www.ietestdrive.com to grab the platform preview - it's pretty good. In my opinion, parts of their SVG support are much better than Firefox currently (but they don't support SMIL yet).