JQuery :: Galleria & Parsing An XML File With Images?
Sep 8, 2009
I have been trying to figure this out for a few days now and I'm stuck. I'm using a JQuery based image gallery called Galleria [URL]... Its simple enough for my needs but I would like it to load the images from an xml file. With that in mind I have been trying to modify the basic demo_01.htm demo file to do just that.
I have used multiple jQuery in my page. Two of them are working fine.When I tried to integrate the galleria script, it says, Error: $("ul.gallery_demo").galleria is not a function The code is working for me separately. Here's the code.
This seems like a noob error, but I really googled it out, with not much results. Got stuck on just grabbing the XML. I validated the code with the w3.org validator and it's only missing a doctype. I've checked that the file is saved with no bom. It's served from my local Apache installation.
The error I get is:
With Firebug I got:
The jQuery code:
The headers look ok to me.Response Headers
I simplified the XML and just put it in a file, but the same error comes up even when the XML is generated with PHP. I did try to change the MIME type in the request and the response, but it's all the same.
Also, if I serve a file I get a 206, and a 200 response code for the same XML generated through PHP (using header("Content-type: text/xml")).
It should not be a cross-domain issue, as it's loaded and served from my localhost?
I did implement my script first for IE8 (sidebar gadget) without jQuery and works nicely with my PHP generated XML. Then I decided to pick up jQuery and hit the first wall head on.
DOM Parsing XML file (am new to using DOM and parsing files) and I am practicing with example files I found online (W3C). I am trying to use DOM to parse and XML file and then display the info retrieved from the XML file in HTML using Javascript. The files are working well and validate, but nothing is displayed when I open the file up in a browser only the style sheet background color I am using. There are 3 JS functions, one loads the XML, the second gets the info and the third displays it. Here is the code, minus the Style sheet I have been trying to figure this out.
HTML Code Code: <?xml version = "1.0" encoding = "utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "[URL]"> <head> <title>Bookstore</title> .....
I am currently working on displaying KML-values of ElementTags within my KML File. I already integrated the KML file as an overlay to my Google Map. But how am I able to parse the GGeoXml-object or how am I able to parse external [URL].. instead of just "polygons.kml") XML-files?
At the moment my code for loading the geoxml file looks like this:
I'm trying to parse my data from an xml file now and print it out on the page based on date from my existing code. I have that working, with each item formatted the same way on the page What I'd like to do now is alter it a bit to make the most recent (the item listed on the top of the page) formatted differently and the rest of them as it is now. Something like - (if 1st <li> then build html like this else build html like that) I hope this makes sense.
I'm trying to write a little Javascript that would parse a CSV file that contains a name and date, and only display the name if the date matches today. Here's some example data:
If today were 6/10/2010, the output of the script would just be "Joe"
I have a simple XML file that looks something close to this:
<presence id="12345"> <status>in a meeting</status> <priority>1</priority>
[Code]....
If you require a bit more info on the project itself, here's a rundown: This xml file is created by an internal chat app at my office. Each employee has their own xml file listing their current availability and status (hence "in a meeting"). This will be used to determine the availability of certain individuals in the building without having to be logged in to the chat app. That's why there's multiple xml files going to be used (roughly 10-15 in the end).
For a project I am working on, I need to retrieve links from html documents. The easy part is to obtain 'plain' links like <A HREF="http://site/path/document">, but when those links are javascript'ized, the only robust solution needs to load the javascript and dom document representation in the same way that browsers do. For example, links in the form:
First I though that using spidermonkey (the mozilla javascript interpreter) should be enough, but in that case, I dont have the document structure elements (like document, window, document.history, document.form.element, etc), so I tried parsing the document using a library to build a tree representation of it, but that leads me to the same problem again, that is, I have to represent all tree nodes as javascript entities.
Anybody here have worked on a similar problem? What tools do you think I should take a look?
When I try to parse xml fixed string following code works fine. When I try to parse the string get from remote server.(bellow code example) It gives me an error unterminated string. I think this error is because of large string. Code:
I'm trying to write a little Javascript that would parse a CSV file that contains a name and date, and only display the name if the date matches today.
Here's some example data:
Name, Date Joe, 6/10/2010 Jane, 7/11/2010
If today were 6/10/2010, the output of the script would just be "Joe"
I have done what i THOUGHT was everything right. I downloaded the jquery min js file, then the galleria.jquery.js file.. Then i created a CSS called galleria.css and edited it to my liking and the ONLY thing that I can get is a BASIC gallery. It seems that the Java is not being read. The css creates the overall LOOK of it, but theres no HOVER, theres no FADE... nothing that the java would typically have done. I just REALLY need to figure out why this is not working.. i have tried it on both my dreamwevaer install AND tried for the heck of it just to upload it to my server and see if it was the local file paths that were causing the issue.. Apparently it was not the case. I get the same results when viewing the page!!
1. I have a number of images placed in my html page simply using the img tag. When the page is loading I see these images stacked (full size) for a few seconds before galleria loads and then begins to convert them into thumbnails. how to hide the images on the page but only to appear in the galleria as the images start to load as thumbnails?
2. I wish to have the same 5px (horizontal) gap between each thumbnail. However my images are of different sizes and have been optimized to a max width or max height. I do not wish for the thumbnails to be cropped so have set: thumb_crop: false, This has now visually created an inconsistent horizontal space between each thumbnail (highlighted in pink to show the gap left and right of each one). I have already attempted to change the thumbnail width to auto in the css, but with no success. How do I remove the 'excess' left & right space from each thumbnail so that the gap appears consistent?
3. Lastly, upon page load, is it possible to hide the main stage image until a thumbnail is selected? I wish to initially display some text (where the main image sits) which is then replaced with the main image when the user clicks on one of the thumbnails.
I've implemented a photo gallery using Galleria and jCarousel on my site, and have chosen to use custom thumbnails instead of having Galleria generate them for me from the source images.
As far as I can tell, there may be an advantage in conserving bandwidth with this method, but the page also degrades to a nice set of thumbnails that link to the larger images (which is very nice, IMO).
Everything works beautifully, however when viewing this gallery for the first time, instead of the large image fading in nicely as it does in the Galleria demo, it almost kind of "slides" the image into view like it's rendering pieces of it as it loads in the container. This is definitely an effect i would like to avoid, but I also thought that one of the benefits of Galleria was that it pre-loaded images in the background, right?
So why does my gallery appear to be loading these images "on-demand"?
I would like to use Galleria to display photos on my website but I'm having trouble getting it to function. I don't know an awful lot about html but I think I've followed the instructions correctly. I would like my gallery to function something like this: [URL] but right now it looks like this: [URL] I'm not so worried about the design aspect because I'm hoping to work on that later but I would like the gallery to work correctly.
I'm only new to Jquery and Ajax for that matter, understand JavaScript but don't work with it everyday. I have a function from Jcarousel that is populating a div with images (talking to a .txt file which contains the url), JavaScript then writes out the image. function getItemHTML(data){ var split = data.split(";"); var url = jQuery.trim(split[0]); var title = jQuery.trim(split[1]); var url_m = url.replace(/_s.jpg/g, '_m.jpg'); return '<a href="' + url_m + '" title="' + title + '" class="thickbox"><img src="' + url + '" width="' + 75 + ' " height="' + 75 + '" alt="' + title + '" /></a>'; };
And this is the function talking to the datasource function loadItemHandler(carousel, start, last, available){ if (available) { // Trigger loaded carousel.loaded(); return; }var cr = carousel; jQuery.get("example_dynamic_ajax.txt", function(data) { appendItemCallback(cr, start, last, data); });}; Now what I would like to do is instead of populating with images from .txt file I would like to populate with code from another .html page (a html page containing a table code). I'm just not entirely sure what object I need to use and how to go about that. Full code that I am working with is here: [URL].
I am trying to set up a photo gallery on a website using the Galleria Javascript. I managed to setup one gallery but I don't know the code to setup another or another two galleries on the same one page. Can anyone help me urgently? When I try to post the code twice, it gives an error message.
I've inherited responsibility for our church's website. It has a sizeable main menu, which uses mouseover image swaps. These images use a pre-load script but the script is only included in the index.html page. My javascript knowledge is weak, but it seems to me if a viewer arrives first at page12.html, he gets no benefit of the preload script. My quandry - Should I include the preload script on every page, or would this force each of these images to download again everytime a viewer moves to a different web page, thereby gumming up the whole works? If I don't add it to every page, the viewer who enters thru a backdoor has a sluggish menu, right?
If the right approach is to include it on every page, can I do this with an external js file? Will I need to call this file, or will it work just by including the js statement in the <head> section: <SCRIPT LANGUAGE="JavaScript" SRC="preloadscript.js"></SCRIPT>
The code works OK in Firefox and Google Chrome, but it fails in Konqueror (khtml) or IE 8.0: the resulting array is empty although the xml read by Ajax call is OK. I tried also with "$("tagname", xml).each()" - same result.