Search jQuery

jQuery Forum

Screen name:
gellabmatt

gellabmatt's Profile

3 Posts

6 Responses

0 Followers

Activity Trend

Last 30 days

Loading Chart...

Show:

Expanded view
List view

html5 video, jQuery, and firefox
[4Replies]
- 08-Oct-2010 02:03 AM
- Forum: Using jQuery
The first two go so well together, but firefox is kicking up a fuss.

my main problem is that I have created sort of a html5 video playlist with about 16 videos.
you click on one of the listed links, the ul fades out, the video fades in and starts playing.
This part works just fine.

Then to get out of the video there is a little close button in the top right of the playlist area.
This uses .remove() to remove the video out of the DOM after it fades out and the menu fades back in.
It works fine in Chrome and Safari (you know GOOD browsers), but firefox being the MSIE second coming doesn't seem to respond to the .remove() call for the video; although it does fade out the video and fade back in the menu as it should.

Any ideas anyone?
Please don't tell me this is just an html5/firefox issue.

Thanks!

Slider Help
[4Replies]
- 16-Aug-2010 05:26 PM
- Forum: Using jQuery UI
So, I have been trying to build a simple slider to act as a scrollbar for a group of images inside a div.

I got really close to getting it work a few times. Ive probably done 4 or 5 tutorials none of which seemed to work.
So, I have back tracked it to be based off the jQuery documentation stuff.
Still no dice.

I'm getting two errors in Chrome using the developer tools :
1st - on line 44 in my html file : "Uncaught TypeError: Object #<an Object> has no method "slider"". which means that the browser cant find the slider - Im not sure why thats happening.

2nd - in the actual jQuery UI js file : "Uncaught ReferenceError: jQuery is not defined" - I have no idea why that is happening, I just downloaded it fresh off the jQuery UI page with everything selected (no theme though).

Maybe someone out there may catch what I am doing wrong.
I'm supposed to send the client a comp by later today.

Here is my code:
2. <!DOCTYPE HTML>
3. <html>
4. <head>
5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
6. <title>Sam Gezari \\ Los Angeles Based Photographer</title>
7. <link rel="stylesheet" href="main.css" />
8. <script type="text/javascript" src="jquery-ui-1.8.4.custom.min.js"></script>
9. <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
11. <script type="text/javascript">
12. document.createElement('header');
13. document.createElement('nav');
14. document.createElement('article');
15. document.createElement('section');
16. document.createElement('footer');
17. document.createElement('canvas');
18. </script>
20. <script type="text/javascript">
22. $(document).ready(function(){
23. //--------------------SET CURRENT PAGE-----------------------\\
26. //--------------------LOAD IMAGES FROM XML--------------------\\
27. $.get('newimages.xml', function(d){
28. $(d).find('image').each(function(){
29. var $image = $(this);
30. var imageUrl = $image.attr("url");
32. var html = '<div class="imageContainer">';
33. html += '<img src="' + imageUrl + '" />';
34. html += '</div>';
36. $('#content').append($(html));
37. });
38. });
40. //--------------------SLIDE INIT-------------------------\\
41. var container = $('#mask');
42. var items = $('#content');
43. var itemsWidth = items.innerWidth() - container.outerWidth();
45. $('#slider').slider({
46. minValue: 0,
47. maxValue: itemsWidth,
48. handle: '#handle',
49. stop: function (event, ui) {
50. items.animate({'left' : ui.value * -1}, 1000);
51. },
52. slide: function (event, ui) {
53. items.css({'left' : ui.value * -1});
54. }
55. });
57. });
59. </script>
60. </head>
62. <body>
63. <nav>
64. <h1><span class="light">sam</span> gezari</h1>
65. <ul id="main">
66. <li class="currentPage">new &emsp;&emsp;</li>
67. <li><a href="#">past</a> &emsp;&emsp;</li>
68. <li><a href="#">book</a> &emsp;&emsp;</li>
69. <li><a href="#">video</a> &emsp;&emsp;</li>
70. <li><a href="#">cv</a> &emsp;&emsp;</li>
71. </ul>
72. </nav>
74. <div id="mask">
75. <div id="content">
76. </div>
77. </div>
79. <div id="slider">
80. <div id="handle"></div>
81. </div>
84. </body>
85. </html>
Thanks for any help!

XML Parsing for Image URLs — Help
[4Replies]
- 06-Jul-2010 11:04 PM
- Forum: Using jQuery
Hello, I am a new comer to jQuery transferring from flash.
Im trying to parse an XML file that has holds the URLs to about 10 images.
However, all the tutorials I have followed do not seem to work.
Ive been trying this for a few days now and I was hoping one of your jQuery gurus may see something I dont.

Here are my codes :
XML :
2. <?xml version="1.0" encoding="UTF-8"?>
3. <Images>
4. <image url="_work/_new/balloonsfocusxtraballoons.jpg"></image>
6. <image url="_work/_new/bkyrd.jpg"></image>
8. <image url="_work/_new/bush.jpg"></image>
10. <image url="_work/_new/chair.jpg"></image>
12. <image url="_work/_new/church.jpg"></image>
14. <image url="_work/_new/dancer2.jpg"></image>
16. <image url="_work/_new/dannyhilljr2combo.jpg"></image>
18. <image url="_work/_new/EPmarket.jpg"></image>
20. <image url="_work/_new/eyecontact.jpg"></image>
22. <image url="_work/_new/fooetkingblanket2.jpg"></image>
24. <image url="_work/_new/gary_working.jpg"></image>
26. <image url="_work/_new/garyinbed_lipseyes.jpg"></image>
28. <image url="_work/_new/gorgeunderpass.jpg"></image>
30. <image url="_work/_new/griffithlamp.jpg"></image>
32. <image url="_work/_new/infinty.jpg"></image>
34. <image url="_work/_new/mcs.jpg"></image>
36. <image url="_work/_new/oceanafterserra.jpg"></image>
38. <image url="_work/_new/oldenglish.jpg"></image>
40. <image url="_work/_new/selfportraitofmeasmygrandfather.jpg"></image>
42. <image url="_work/_new/signs.jpg"></image>
44. <image url="_work/_new/streetlightfocusared.jpg"></image>
45. </Images>
HTML (with jQuery at the top):
2. <html>
3. <head>
4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
5. <title>xml parse test</title>
6. <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
7. <script type="text/javascript">
9. $(document).ready(function(){
10. $.get('newimages.xml', function(d){
11. $('div#content').append('<h1>Images</h1>');
13. $(d).find('image').each(function(){
14. var $image = $(this);
15. var imageUrl = $image.attr("url").text();
17. var html = '<img src="' + imageUrl + '" />';
19. $('div#content').append($(html));
20. });
21. });
22. });
23. </script>
24. </head>
26. <body>
27. <div id="content" style="background-color:#999; position:absolute; top:150px; left: 200px; width: 1000px; max-width:width: 1000px; height:inherit; min-height:500px;">
28. </div>
29. </body>
30. </html>
Thanks in advance for your help.

«Prev
Next »

Response title

Attachments

jQuery Forum

Activity Trend