I am looking for either a JavaScript or Coldfusion solution to the following problem. First, there are over 60 million product photos so downloading and resizing the photos using Coldfusion would be very tedious.
I would like the display an image within a 100 x 100 pixel container.
If the height or width of the image is great than 100 pixels, the image should reduce in size to fit within the 100 x 100 pixel container.
I want to avoid pixelation of the images as much as possible.
All images are external and not on the local server so I only have an image URL.
I would like to hide all images until they are resized appropriately.
Does anybody know of a piece of javascript code that can do something similar to this?
Is there a way to create a div or some container in which there will be an image such that the image fills the container but retains its aspect ratio? So if the container is 100px x 100px and an image is 200px x 100px it will be resized to 100px x 50px. Conversely, if the image is 100px x 200px then it resizes to 50px x 100px. An image of 400px x 50px becomes 100px x 12.5px and so forth.
The issue is I have to dynamically build the container pulling images from an image folder. The images can come in all sizes. But I want to make sure they all fit in the same square 'box' without distorting the image.
There is text and a button below the image and I want them to stay in the same 'spot' on the screen without being moved around because the height or width of the image above it grows/shrinks to accommodate a change in either the height or width. These can change but not outside a controlled 'box'.
Maybe there's a way to get the actual size (through Javascript or something) then calculate a percentage to resize the image to?
I'm having difficulty loading images via Ajax on a site that I've been working on.I'm performing the ajax by using the Request.HTML object of the MooTools framework. Basically, I'm just passing some parameters to a php script which outputs some image tags and then I insert that HTML into a pre-defined content div. For some reason though, it seems that big images don't seem to load consistently when using this technique. Usually, they will just show up as broken images, but when I navigate to the url of the image that is 'broken', it displays just fine. Also, occasionally after navigating to the actual url of the image, my browser will cache the image and then it will display just fine when loading it through Ajax.
It's for a photo gallery like this http:[url].....php but the one I need it for has 100 images so the page loads much slower. I can't just put the loading gif behind the images (as you would normaly) because you can see it with each image fade in and out. how I can have a loading gif show "only" while the images are initially loading, and then it goes away?
Im loading a div of an external html (#right_in) into a div (#right) in my main movie this way:
Code: var toLoad = divobj.id+'.html #right_in'; function loadContent() { $('#right').load(toLoad);
[Code]....
Is it possible to specify that the DIV has to load always at y=0, ie from the top? Because when I load another external div into my main div firefox keeps the latest position (if I scrolled before it loads the new page at that point).
i was wondering if it is possible to load text into a string from an external text file. the reason is that i have a very large string and it is making my script very messy.
also, is it possible to have some dynamic parts of the text from the text file? for example, if i load in a string and there is a part of it that inserts a value from a variable like the following:
'The number of people is ' + var_people_num;
....so the text from the external file would load but these parts would be given the value of a variable contained in the script that calls the external file. its not absolutely crucial that i obtain this but it would help me seperate large chunks that complicate the script.
Im loading a div of an external html (#right_in) into a div (#right) in my main movie this way:
var toLoad = divobj.id+'.html #right_in'; function loadContent() { $('#right').load(toLoad); showNewContent();
[Code]....
Is it possible to specify that the DIV has to load always at y=0, ie from the top? Because when I load another external div into my main div firefox keeps the latest position (if I scrolled before it loads the new page at that point).
I'm currently working on a site and need to have a small section that displays 5 or 6 headlines. The same headlines will displayed on various pages and will occassionally be updated.
The site pages are static .html in design and i'd prefer to keep it that way rather than start introducing php for such a minor part of the site.
I am wondering if there is a javascript solution to this, whereby the headlines could be loaded via a .txt / .xml document or something similar?? That way i could just manually update the file and reload it to the server and the headlines would be updated.
I guess i'm think something similar to cushyCMS but that i can implement directly.
I have a number off videos that I want to play on a video player that I made using Flash. I can change what video the player plays by changing the filename in the red line in the following code.
In my page, I have to load an external javascript (it's an ad serving code, using src='....') and once the external site is not accessible, it slows down my site significantly (to a level that unacceptable to visitors). Is there anything I can do to prevent this? Or anything the ad server needs to change?
I am working on a client's site and he has some external javascript code that his affiliates can put on their websites to fetch some data. However, when my client's site goes down, the affiliates' sites cease to load thus taking their sites down with it.
Is there any way I can have the javascript check to see if the website is up before loading, and if it is, run this: Code:
I have a page with some links and a div. When I click on one of those link I want it to load HTML into the empty div on that page. The HTML I want to load is on a different page (in the same dir). The different information that each link has to link has been divided into div on that source page.
I'm so far able to load the entire page in my div, but I just want the contents of one of the specific divs, depending on what link I click.
I got this far with the help from Google and a book but I'm stuck now.
This is the function I use to get the content.
Code: function sendRequest(scriptFile, targetElement) { target = targetElement; try{
[Code]....
sources.html is the source-page and details is the name from the target div where the content gets loaded into. Remember; this works but I want to specify divs instead of the entire page.
I have been struggling with a cross browser solution to loading external javascript files on the fly.
I have been successful using the following code in IE6:
var newScr = document.createElement("SCRIPT"); newScr.src = "newScr.js"; newScr.type="text/javascript"; document.getElementsByTagName("head")[0].appendChild(newScr);
I believe the reason is that IE is loading the external file syncronously while Firefox is not. Is there an onload event for creating an element (if so I do not see it in Venkman). I have seen the solution of using XMLHTTP to load the script but I am trying to get around any dependency (atleast at this stage of the library) on activex.
In my page I have a modal dialog that i use to pull in external content from another site within my domain. I pull in html content that has a document.ready function which then pulls in external js files. This works fine in firefox and ie but in chrome the document ready is not even being fired - it will only load the html content. How can I get that to work properly in chrome? Is this a security restriction?
I'm fairly new to jquery so apologies if this is a very simple question with a very simple answer, but I just can't figure out the solution. I have an overlay div, and when I close the overlay I want to remove the html inside it and then re-load it from the specified file. I have already worked out how to empty the div, but what I now want to do is re-populate it with the content from a separate file on my web server.
how to load an XML file into a DOM. I can get it done in IE, but in mozilla I am missing something. Here is what my loadXML() function looks like:
function loadXML(){ try { xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async = "false"; xmlDoc.onreadystatechange = verify; hasFile = xmlDoc.load(info.XMLDocument); if (hasFile){ xmlObj = xmlDoc.documentElement; allTopics = xmlObj.getElementsByTagName("topic"); }} catch(e) { xmlDoc = (new DOMParser()).parseFromString(document.getElementById('info').innerHTML, 'text/xml'); hasFile = true; allTopics = xmlDoc.getElementsByTagName("topic");
if (hasFile){ allTopics = xmlDoc.getElementsByTagName("topic"); alert(allTopics[0].firstChild.getAttribute("name")); }}}
Where verify is another function. The try part works for IE, but the catch part doesn't work for Mozilla. I am not finding any information as to really use an XML DOM properly in Mozilla. I'm trying to get allTopics to be a handle on the same thing in both the "try" and the "catch".
I have a parent page say index.html on which I have a div. Now, I want to load some content from the child page (external page) say inner.html into the div on parent page. As far as I have worked on it I found that I can do this via ajax using "obj.responseText" but I am not hitting the right point.
I load external php page using jqury plugin . with this line: <a href="cat.php" rel="container">Tab 2</a> How to hidden href url ( cat.php ) for more security and not show in html source code page? Example: <a href="Block12" rel="container">Tab 2</a> Block 12 is php code to generate cat.php addresse Block 13 is php code to generate data.php addresse etc...
I would like to do something similar to the following link: http:[url]....In order to post links to websites I have done.how to do this without Frames?I see rockettheme uses Mootools but I have searched for mootools tutorials on this and couldn't find anything.