I have an HTML document type which is designed to display a form pulling data from a database application and generating a webpage that can then be printed. It's not intended to be published online, I'm just using HTML & CSS to format the page as the reporting tools within the application don't allow for decent formatting.
I'm trying to display pictures which are held on a shared drive. The code used is
<IMG SRC="X:\images\<primarykey>.jpg" height="100">
where X is the drive on which the pictures live (which users have access to), and is the unique identifier for each picture populated by the reporting tool when the html is generated.
IE can display the pictures, but Firefox does not and displays the text instead. I really need to make this work in Firefox as IE is messing up the layout of the form further down.
I've experimented with changing the IMG SRC declaration, using a relative path and forward slashes, etc. but haven't been able to get it to work.
Any advice would be great!
Thanks
Kat
Suggestions:
At mentioned by Sam, lower case the element and attributes.
Try src as: src="file:///X:/images/.jpg"
If the output is expected to be valid XHTML, you might need to ensure the is self closing, eg:<img .... />
Related
I have a program that let's people design web pages graphically. Then hitting Publish creates an html file that is supposed to be an exact copy of what they created. The elements created by the editor are HTML elements. Publish then gathers up all the elements that have been created and for each one adds it to a string with
canvasOuterHTML += clone$[0].outerHTML;
So all the styles, text, etc., get put on the string. This string, along with some other information is written to the .html version of the page, and when this .html is loaded into a browser the browser displays the page!
But something is expanding the published page vertically. I've created the simple page below to illustrate. The first image is the page in the editor. The second image is what the html displays in the browser.
I'm completely stumped because the HTML and CSS for the two markups is exactly the same, so how can one be higher? I can't even think of a mechanism that would do that. Does anyone have any ideas? Thanks.
I am wondering if someone can help me with a problem I am encountering with iPhone/iPad. I have an email the generates a report as an HTML attachment. In that HTML attachment, there are two images. One is a static image that pulls down a logo using a normal HTML img tag.
The other is dynamic. It also uses the normal HTML img tag, however it calls out to a web api with some information identifying the user.
<img src="http://MyApiServerName.com/api/User/{id}/{OtherParm}" >
The Web API uses information on the user to return appropriate images to them. For some reason the dynamic image does not show up with the attachment is opened on an iPad/iPhone.
The image works just fine when the attachment is opened from a computer. I thought maybe something might be blocking images, however then I would expect the static image not to display as well. I verified that the "Load Remote Images" setting is turned on.
I am at a loss here. Is there something with iOS that prevents dynamically generated images from showing in HTML attachments?
Thanks
Ok, I can't explain why the above is not working, but I did find something that does. Instead of using the following URL
<img src="http://MyApiServerName.com/api/User/{id}/{OtherParm}" >
use
<img src="http://MyApiServerName.com/api/User/{id}/{OtherParm.jpg}/" >
The final param needs to end with ".jpg/". If the slash is not there, you will get a 404 error.
Then in the API method, you simply strip off the .jpg part of "OtherParm" to get the intended value for "OtherParm".
My image thumbnail links to the full size image. Now only the image is showing up as some sort of code. I have been using the same HTML editor for years, all the pages are the same. It is only this group of 5 pages that have thumbnails. Take this link for example:
ÿØÿáExifII*ÿìDucky2ÿáyhttp://ns.adobe.com/xap/1.0/ ÿíHPhotoshop 3.08BIMZ%G8BIM%üá‰È·Éx/4b4XwëÿîAdobedÀÿÛ
I also discovered that if I get this code an then go up to the history and click on the name of the photo it pops right up as it should have been. I have no idea how to fix this. I have uploaded the photos several times with two file managers, used other photo software aswell. My editor shows that these pages are fine, but IE shows that the pages have no style and all browsers show the linked image problem.
I know this doesn't make much sense to you professionals, but this is my business website and a customer told me about the problem. After 8 hours of trying to fix this I am hoping you could help.
The problem:
This problem occurs when an IMG changes or got touched (by adobe, in your case) AFTER it was uploaded to the server and the name of the new (or modified) IMG remained the same. The image shown does not get refreshed. The old image is still shown, even though the database holds the right image. I have narrowed it down to the fact that the IMAGE IS CACHED in the web browser. If we hit the RELOAD button in Firefox/Explorer/Safari, everything gets refreshed fine and the correct image just appears.
I verified that on your site running the following:
function is_cached(img_url){
var imgEle = document.createElement("img");
imgEle.src = img_url;
return imgEle.complete || (imgEle.width+imgEle.height) > 0;
}
And then I called this function which returns true or false depending on cached or not:
is_cached("photos/back_to_school_pr5_tn.jpg");
And the result came back as:
<- true
Remember: When uploading an image, its filename is not kept in the database. It is renamed as Image.jpg (to simply things out when using it). When replacing the existing image with a new one, the name doesn't change either. Just the content of the image file changes.
Solution one - No code required:
Since you are not in the coding business (as you claim), all you need to do is to rename the IMG after it's been touched by adobe.
Whenever you modify a photo in adobe or you upload a new IMG you should give it a new name since the older version of the IMG IS STILL IN CACHE.
Solution two - Coding required:
If touching the IMG with adobe is a constant thing that you do after you upload the original picture, then the above solution can be an hassle, so you might want to look into ways to force the web browser to NOT cache images from this page.
NOTE: This solution is only good for the future. In your case, the IMG is already cached.
Besides, this will only work if the actual IMG is inside your HTML, but on your site the link takes you to the actual IMG.
Solution three - Coding required:
An important addition to the above solution is that you can never force a browser to do anything. All you can do is make friendly suggestions. It's up to the browser and the user to actually follow those suggestions. A browser is free to ignore this, or a user could override the defaults.
So the best long-term solution will be to save the filename with the database. This way, if the image is changed, the src of the IMG tag will also change.
For example:
<img src="picture.jpg?1222259157.415" alt="">
where "1222259157.415" is the current time on the server. (Note: I used python's time.time() to generate that)
Never mind. Excel does generate .xl99999 styles in a <header>. When this rich text editor value is set with HTML content, it adds the styles but when you try to get the value later, it only returns the <body> tag and strips the styles. I saw the contents after getting the value and submitting to the server. I guess you could say there is a bug in the rich text editor, but I will attempt to work around it.
How does Chrome know how to format these CSS classes exported from Microsoft Excel into HTML when I never specified the stylesheet to use? It is just a pure HTML string that was sent via an API so there is no stylesheet definitions. The class .xl6613001 is never defined, nor any others. So how does Chrome know to use a given background color?
Minus http://i.minus.com/iX77mOMM3dNNS.png
Here is the full output from Excel. Notice the lack of color styles.
The rich text editor is com.gc.gwt.wysiwyg.client.Editor, https://code.google.com/p/gwt-html-editor/wiki/GettingStarted.
I searched the Resources tab for '.xl' and nothing was found.
It does not format colors if I look at the raw HTML as a file.
I am creating a web page that accepts a hyperlink from the user and displays that page in an iframe. While rendering the page, I would like to show just the text and simple colors, thats it.
I would like to block all the media files like images and flash scripts from showing up.
If not an extensive one, for the starters, I would like to confine the scope to .gif, .jpeg, .jpg, .png, .swf.
Or does anyone know of a site with similar functionality?
You can write a simple dom parser and parse the page before show it in iframe. Then before showing it you can remove whatever you want.
your iframe whould like
<iframe src="your_parser.php"></iframe>
In your parser you can get the content from page using file_get_contents() or curl() it is your choise (i would use curl). Then you can remove the media you want.
If you're using Firefox, use the Adblock Plus extension. You can specify the types of items to block via a filter rule. An example (using Safaribooks) looks like this:
||techbus.safaribooksonline.com/static/201109-2191-techbus/images/6.0/*.jpg
However, if you're talking about incorporating functionality into your page to strip out a specific list of content-types, this approach wouldn't help you. You'd need to pull the html source and strip out the offending content-types.
also if you are using cms. you should be turn off bbcode image, and embed html