[jQuery] Re: Question related to Javascript
If you are using Prototype and jQuery you will need to do: var $j =jQuery.noConflict(); otherwise the will be a conflict for the $. Then, when you wan't to do things in jQuery, do $j and when you want to do things in Prototype, do $. Is $(imgDisplay0).src = imgs0Slideshow[start].image; correct? I believe this is correct for Prototype, and means the source of the image with an id of imgDisplay0 is set to imgs0Slideshow[start].image In jQuery, the same line is: $('#imgDisplay0').attr('src', imgs0Slideshow[start].image); With jQuery, you cannot access any of the DOM element attributes or methods directly because they are stored in a jQuery collection that is returned. Look at the jQuery documentation on the jQuery site, it is quite extensive and will show you what you need. If you need help with Prototype code though, you should try the Prototype google group instead. On Feb 8, 11:52 pm, MH1988 m.lawrencehu...@gmail.com wrote: Would be great if someone could still help me out? On Feb 8, 10:01 pm, MH1988 m.lawrencehu...@gmail.com wrote: Sorry, just also to mention, I am integrating this within WordPress and I am using the jQuery framework for another gallery. On Feb 8, 9:58 pm, MH1988 m.lawrencehu...@gmail.com wrote: Thanks so much for the help. I'm afraid it still isn't working correctly. I tried [0] which to me means it initiates the very first image as soon as it preloads. For more details of how I am using this, I am actually using the Prototype script framework which makes this image gallery work. Is $(imgDisplay0).src = imgs0Slideshow[start].image; correct? I'm wondering if there is still something missing to make it work? Also, it would also be great if you could explain some of the things mentioned more simpler as I'm inexperienced. Many thanks. On Feb 8, 8:11 pm, seasoup seas...@gmail.com wrote: Also, instead of saying var imgs0Slideshow = new Array(); imgs0Slideshow[0] = new Object(); It's easier to just say var imgs0Slideshow = []; imgs0Slideshow[0] = {}; and that achieves the exact same thing. On Feb 8, 1:10 am, seasoup seas...@gmail.com wrote: $(imgDisplay0_title).innerHTML = title; $(imgDisplay0_caption).innerHTML = caption; $(imgDisplay0_number).innerHTML = 1 of + imgs0Slideshow.length + Articles; should be $(imgDisplay0_title).html(title); $(imgDisplay0_caption).html(caption); $(imgDisplay0_number).html('1 of ' + imgs0Slideshow.length + ' Articles'); or $(imgDisplay0_title).text(title); $(imgDisplay0_caption).text(caption); $(imgDisplay0_number).text('1 of ' + imgs0Slideshow.length + ' Articles'); or $(imgDisplay0_title).get(0).innerHTML = title; $(imgDisplay0_caption).get(0).innerHTML = caption; $(imgDisplay0_number).get(0).innerHTML = 1 of + imgs0Slideshow.length + Articles; or $(imgDisplay0_title)[0].innerHTML = title; $(imgDisplay0_caption)[0].innerHTML = caption; $(imgDisplay0_number)[0].innerHTML = 1 of + imgs0Slideshow.length + Articles; .html('text'); is the standard jQuery way to do add html, but is slower then .text which is the jQuery way to add plain text, which is slower then .innerHTML, but not by significant amounts unless you are in a big loop. .html() also handles removing events from DOM Elements that are written over this way which prevents circular references that can cause memory leaks. but, if speed is a big factor and you don't have any events doing .get(0) or [0] work. The problem is that $() returns a jQuery collection not a DOM object with the .innerHTML method. .get(0) or [0] will return the first element in the jQuery collection which is the DOM node you are looking for with the innerHTML method. Hope that helps. Josh Powell On Feb 7, 10:10 pm, MH1988 m.lawrencehu...@gmail.com wrote: I hope I am able to still receive assistance even though this isn't jQuery 100% and what I have is an image gallery I am using. The only thing I need to work out is how to make sure the initial title and captions appear when you load the webpage? script type='text/javascript' var imgs0Slideshow = new Array(); var imgs0; imgs0Slideshow[0] = new Object(); imgs0Slideshow[0].image = ; imgs0Slideshow[0].title = ; imgs0Slideshow[0].caption = shshshshshsh; imgs0Slideshow[1] = new Object(); imgs0Slideshow[1].image = ; imgs0Slideshow[1].title = Array; imgs0Slideshow[1].caption = shshshshs; imgs0Slideshow[2] = new Object(); imgs0Slideshow[2].image = ; imgs0Slideshow[2].title = ; imgs0Slideshow[2].caption = shshshsh; var start = 0; imgs0 = new MudFadeGallery('imgs0', 'imgDisplay0', imgs0Slideshow, {startNum: start, preload: true, autoplay: 4});
[jQuery] Re: Question related to Javascript
$(imgDisplay0_title).innerHTML = title; $(imgDisplay0_caption).innerHTML = caption; $(imgDisplay0_number).innerHTML = 1 of + imgs0Slideshow.length + Articles; should be $(imgDisplay0_title).html(title); $(imgDisplay0_caption).html(caption); $(imgDisplay0_number).html('1 of ' + imgs0Slideshow.length + ' Articles'); or $(imgDisplay0_title).text(title); $(imgDisplay0_caption).text(caption); $(imgDisplay0_number).text('1 of ' + imgs0Slideshow.length + ' Articles'); or $(imgDisplay0_title).get(0).innerHTML = title; $(imgDisplay0_caption).get(0).innerHTML = caption; $(imgDisplay0_number).get(0).innerHTML = 1 of + imgs0Slideshow.length + Articles; or $(imgDisplay0_title)[0].innerHTML = title; $(imgDisplay0_caption)[0].innerHTML = caption; $(imgDisplay0_number)[0].innerHTML = 1 of + imgs0Slideshow.length + Articles; .html('text'); is the standard jQuery way to do add html, but is slower then .text which is the jQuery way to add plain text, which is slower then .innerHTML, but not by significant amounts unless you are in a big loop. .html() also handles removing events from DOM Elements that are written over this way which prevents circular references that can cause memory leaks. but, if speed is a big factor and you don't have any events doing .get(0) or [0] work. The problem is that $() returns a jQuery collection not a DOM object with the .innerHTML method. .get(0) or [0] will return the first element in the jQuery collection which is the DOM node you are looking for with the innerHTML method. Hope that helps. Josh Powell On Feb 7, 10:10 pm, MH1988 m.lawrencehu...@gmail.com wrote: I hope I am able to still receive assistance even though this isn't jQuery 100% and what I have is an image gallery I am using. The only thing I need to work out is how to make sure the initial title and captions appear when you load the webpage? script type='text/javascript' var imgs0Slideshow = new Array(); var imgs0; imgs0Slideshow[0] = new Object(); imgs0Slideshow[0].image = ; imgs0Slideshow[0].title = ; imgs0Slideshow[0].caption = shshshshshsh; imgs0Slideshow[1] = new Object(); imgs0Slideshow[1].image = ; imgs0Slideshow[1].title = Array; imgs0Slideshow[1].caption = shshshshs; imgs0Slideshow[2] = new Object(); imgs0Slideshow[2].image = ; imgs0Slideshow[2].title = ; imgs0Slideshow[2].caption = shshshsh; var start = 0; imgs0 = new MudFadeGallery('imgs0', 'imgDisplay0', imgs0Slideshow, {startNum: start, preload: true, autoplay: 4}); var title = (imgs0Slideshow[0].title) ? imgs0Slideshow[0].title : No Title; var caption = (imgs0Slideshow[0].caption) ? imgs0Slideshow [0].caption : No caption; $(imgDisplay0_title).innerHTML = title; $(imgDisplay0_caption).innerHTML = caption; $(imgDisplay0_number).innerHTML = 1 of + imgs0Slideshow.length + Articles; $(imgDisplay0).src = imgs0Slideshow[start].image; /script The entire Gallery works correctly but I am not sure if the last part of the script is structured correctly. When it is first loaded, the first image does appear but without it's title and captions and I want to show it.
[jQuery] Re: Question related to Javascript
Also, instead of saying var imgs0Slideshow = new Array(); imgs0Slideshow[0] = new Object(); It's easier to just say var imgs0Slideshow = []; imgs0Slideshow[0] = {}; and that achieves the exact same thing. On Feb 8, 1:10 am, seasoup seas...@gmail.com wrote: $(imgDisplay0_title).innerHTML = title; $(imgDisplay0_caption).innerHTML = caption; $(imgDisplay0_number).innerHTML = 1 of + imgs0Slideshow.length + Articles; should be $(imgDisplay0_title).html(title); $(imgDisplay0_caption).html(caption); $(imgDisplay0_number).html('1 of ' + imgs0Slideshow.length + ' Articles'); or $(imgDisplay0_title).text(title); $(imgDisplay0_caption).text(caption); $(imgDisplay0_number).text('1 of ' + imgs0Slideshow.length + ' Articles'); or $(imgDisplay0_title).get(0).innerHTML = title; $(imgDisplay0_caption).get(0).innerHTML = caption; $(imgDisplay0_number).get(0).innerHTML = 1 of + imgs0Slideshow.length + Articles; or $(imgDisplay0_title)[0].innerHTML = title; $(imgDisplay0_caption)[0].innerHTML = caption; $(imgDisplay0_number)[0].innerHTML = 1 of + imgs0Slideshow.length + Articles; .html('text'); is the standard jQuery way to do add html, but is slower then .text which is the jQuery way to add plain text, which is slower then .innerHTML, but not by significant amounts unless you are in a big loop. .html() also handles removing events from DOM Elements that are written over this way which prevents circular references that can cause memory leaks. but, if speed is a big factor and you don't have any events doing .get(0) or [0] work. The problem is that $() returns a jQuery collection not a DOM object with the .innerHTML method. .get(0) or [0] will return the first element in the jQuery collection which is the DOM node you are looking for with the innerHTML method. Hope that helps. Josh Powell On Feb 7, 10:10 pm, MH1988 m.lawrencehu...@gmail.com wrote: I hope I am able to still receive assistance even though this isn't jQuery 100% and what I have is an image gallery I am using. The only thing I need to work out is how to make sure the initial title and captions appear when you load the webpage? script type='text/javascript' var imgs0Slideshow = new Array(); var imgs0; imgs0Slideshow[0] = new Object(); imgs0Slideshow[0].image = ; imgs0Slideshow[0].title = ; imgs0Slideshow[0].caption = shshshshshsh; imgs0Slideshow[1] = new Object(); imgs0Slideshow[1].image = ; imgs0Slideshow[1].title = Array; imgs0Slideshow[1].caption = shshshshs; imgs0Slideshow[2] = new Object(); imgs0Slideshow[2].image = ; imgs0Slideshow[2].title = ; imgs0Slideshow[2].caption = shshshsh; var start = 0; imgs0 = new MudFadeGallery('imgs0', 'imgDisplay0', imgs0Slideshow, {startNum: start, preload: true, autoplay: 4}); var title = (imgs0Slideshow[0].title) ? imgs0Slideshow[0].title : No Title; var caption = (imgs0Slideshow[0].caption) ? imgs0Slideshow [0].caption : No caption; $(imgDisplay0_title).innerHTML = title; $(imgDisplay0_caption).innerHTML = caption; $(imgDisplay0_number).innerHTML = 1 of + imgs0Slideshow.length + Articles; $(imgDisplay0).src = imgs0Slideshow[start].image; /script The entire Gallery works correctly but I am not sure if the last part of the script is structured correctly. When it is first loaded, the first image does appear but without it's title and captions and I want to show it.
[jQuery] Re: Question related to Javascript
Thanks so much for the help. I'm afraid it still isn't working correctly. I tried [0] which to me means it initiates the very first image as soon as it preloads. For more details of how I am using this, I am actually using the Prototype script framework which makes this image gallery work. Is $(imgDisplay0).src = imgs0Slideshow[start].image; correct? I'm wondering if there is still something missing to make it work? Also, it would also be great if you could explain some of the things mentioned more simpler as I'm inexperienced. Many thanks. On Feb 8, 8:11 pm, seasoup seas...@gmail.com wrote: Also, instead of saying var imgs0Slideshow = new Array(); imgs0Slideshow[0] = new Object(); It's easier to just say var imgs0Slideshow = []; imgs0Slideshow[0] = {}; and that achieves the exact same thing. On Feb 8, 1:10 am, seasoup seas...@gmail.com wrote: $(imgDisplay0_title).innerHTML = title; $(imgDisplay0_caption).innerHTML = caption; $(imgDisplay0_number).innerHTML = 1 of + imgs0Slideshow.length + Articles; should be $(imgDisplay0_title).html(title); $(imgDisplay0_caption).html(caption); $(imgDisplay0_number).html('1 of ' + imgs0Slideshow.length + ' Articles'); or $(imgDisplay0_title).text(title); $(imgDisplay0_caption).text(caption); $(imgDisplay0_number).text('1 of ' + imgs0Slideshow.length + ' Articles'); or $(imgDisplay0_title).get(0).innerHTML = title; $(imgDisplay0_caption).get(0).innerHTML = caption; $(imgDisplay0_number).get(0).innerHTML = 1 of + imgs0Slideshow.length + Articles; or $(imgDisplay0_title)[0].innerHTML = title; $(imgDisplay0_caption)[0].innerHTML = caption; $(imgDisplay0_number)[0].innerHTML = 1 of + imgs0Slideshow.length + Articles; .html('text'); is the standard jQuery way to do add html, but is slower then .text which is the jQuery way to add plain text, which is slower then .innerHTML, but not by significant amounts unless you are in a big loop. .html() also handles removing events from DOM Elements that are written over this way which prevents circular references that can cause memory leaks. but, if speed is a big factor and you don't have any events doing .get(0) or [0] work. The problem is that $() returns a jQuery collection not a DOM object with the .innerHTML method. .get(0) or [0] will return the first element in the jQuery collection which is the DOM node you are looking for with the innerHTML method. Hope that helps. Josh Powell On Feb 7, 10:10 pm, MH1988 m.lawrencehu...@gmail.com wrote: I hope I am able to still receive assistance even though this isn't jQuery 100% and what I have is an image gallery I am using. The only thing I need to work out is how to make sure the initial title and captions appear when you load the webpage? script type='text/javascript' var imgs0Slideshow = new Array(); var imgs0; imgs0Slideshow[0] = new Object(); imgs0Slideshow[0].image = ; imgs0Slideshow[0].title = ; imgs0Slideshow[0].caption = shshshshshsh; imgs0Slideshow[1] = new Object(); imgs0Slideshow[1].image = ; imgs0Slideshow[1].title = Array; imgs0Slideshow[1].caption = shshshshs; imgs0Slideshow[2] = new Object(); imgs0Slideshow[2].image = ; imgs0Slideshow[2].title = ; imgs0Slideshow[2].caption = shshshsh; var start = 0; imgs0 = new MudFadeGallery('imgs0', 'imgDisplay0', imgs0Slideshow, {startNum: start, preload: true, autoplay: 4}); var title = (imgs0Slideshow[0].title) ? imgs0Slideshow[0].title : No Title; var caption = (imgs0Slideshow[0].caption) ? imgs0Slideshow [0].caption : No caption; $(imgDisplay0_title).innerHTML = title; $(imgDisplay0_caption).innerHTML = caption; $(imgDisplay0_number).innerHTML = 1 of + imgs0Slideshow.length + Articles; $(imgDisplay0).src = imgs0Slideshow[start].image; /script The entire Gallery works correctly but I am not sure if the last part of the script is structured correctly. When it is first loaded, the first image does appear but without it's title and captions and I want to show it.
[jQuery] Re: Question related to Javascript
Sorry, just also to mention, I am integrating this within WordPress and I am using the jQuery framework for another gallery. On Feb 8, 9:58 pm, MH1988 m.lawrencehu...@gmail.com wrote: Thanks so much for the help. I'm afraid it still isn't working correctly. I tried [0] which to me means it initiates the very first image as soon as it preloads. For more details of how I am using this, I am actually using the Prototype script framework which makes this image gallery work. Is $(imgDisplay0).src = imgs0Slideshow[start].image; correct? I'm wondering if there is still something missing to make it work? Also, it would also be great if you could explain some of the things mentioned more simpler as I'm inexperienced. Many thanks. On Feb 8, 8:11 pm, seasoup seas...@gmail.com wrote: Also, instead of saying var imgs0Slideshow = new Array(); imgs0Slideshow[0] = new Object(); It's easier to just say var imgs0Slideshow = []; imgs0Slideshow[0] = {}; and that achieves the exact same thing. On Feb 8, 1:10 am, seasoup seas...@gmail.com wrote: $(imgDisplay0_title).innerHTML = title; $(imgDisplay0_caption).innerHTML = caption; $(imgDisplay0_number).innerHTML = 1 of + imgs0Slideshow.length + Articles; should be $(imgDisplay0_title).html(title); $(imgDisplay0_caption).html(caption); $(imgDisplay0_number).html('1 of ' + imgs0Slideshow.length + ' Articles'); or $(imgDisplay0_title).text(title); $(imgDisplay0_caption).text(caption); $(imgDisplay0_number).text('1 of ' + imgs0Slideshow.length + ' Articles'); or $(imgDisplay0_title).get(0).innerHTML = title; $(imgDisplay0_caption).get(0).innerHTML = caption; $(imgDisplay0_number).get(0).innerHTML = 1 of + imgs0Slideshow.length + Articles; or $(imgDisplay0_title)[0].innerHTML = title; $(imgDisplay0_caption)[0].innerHTML = caption; $(imgDisplay0_number)[0].innerHTML = 1 of + imgs0Slideshow.length + Articles; .html('text'); is the standard jQuery way to do add html, but is slower then .text which is the jQuery way to add plain text, which is slower then .innerHTML, but not by significant amounts unless you are in a big loop. .html() also handles removing events from DOM Elements that are written over this way which prevents circular references that can cause memory leaks. but, if speed is a big factor and you don't have any events doing .get(0) or [0] work. The problem is that $() returns a jQuery collection not a DOM object with the .innerHTML method. .get(0) or [0] will return the first element in the jQuery collection which is the DOM node you are looking for with the innerHTML method. Hope that helps. Josh Powell On Feb 7, 10:10 pm, MH1988 m.lawrencehu...@gmail.com wrote: I hope I am able to still receive assistance even though this isn't jQuery 100% and what I have is an image gallery I am using. The only thing I need to work out is how to make sure the initial title and captions appear when you load the webpage? script type='text/javascript' var imgs0Slideshow = new Array(); var imgs0; imgs0Slideshow[0] = new Object(); imgs0Slideshow[0].image = ; imgs0Slideshow[0].title = ; imgs0Slideshow[0].caption = shshshshshsh; imgs0Slideshow[1] = new Object(); imgs0Slideshow[1].image = ; imgs0Slideshow[1].title = Array; imgs0Slideshow[1].caption = shshshshs; imgs0Slideshow[2] = new Object(); imgs0Slideshow[2].image = ; imgs0Slideshow[2].title = ; imgs0Slideshow[2].caption = shshshsh; var start = 0; imgs0 = new MudFadeGallery('imgs0', 'imgDisplay0', imgs0Slideshow, {startNum: start, preload: true, autoplay: 4}); var title = (imgs0Slideshow[0].title) ? imgs0Slideshow[0].title : No Title; var caption = (imgs0Slideshow[0].caption) ? imgs0Slideshow [0].caption : No caption; $(imgDisplay0_title).innerHTML = title; $(imgDisplay0_caption).innerHTML = caption; $(imgDisplay0_number).innerHTML = 1 of + imgs0Slideshow.length + Articles; $(imgDisplay0).src = imgs0Slideshow[start].image; /script The entire Gallery works correctly but I am not sure if the last part of the script is structured correctly. When it is first loaded, the first image does appear but without it's title and captions and I want to show it.
[jQuery] Re: Question related to Javascript
Would be great if someone could still help me out? On Feb 8, 10:01 pm, MH1988 m.lawrencehu...@gmail.com wrote: Sorry, just also to mention, I am integrating this within WordPress and I am using the jQuery framework for another gallery. On Feb 8, 9:58 pm, MH1988 m.lawrencehu...@gmail.com wrote: Thanks so much for the help. I'm afraid it still isn't working correctly. I tried [0] which to me means it initiates the very first image as soon as it preloads. For more details of how I am using this, I am actually using the Prototype script framework which makes this image gallery work. Is $(imgDisplay0).src = imgs0Slideshow[start].image; correct? I'm wondering if there is still something missing to make it work? Also, it would also be great if you could explain some of the things mentioned more simpler as I'm inexperienced. Many thanks. On Feb 8, 8:11 pm, seasoup seas...@gmail.com wrote: Also, instead of saying var imgs0Slideshow = new Array(); imgs0Slideshow[0] = new Object(); It's easier to just say var imgs0Slideshow = []; imgs0Slideshow[0] = {}; and that achieves the exact same thing. On Feb 8, 1:10 am, seasoup seas...@gmail.com wrote: $(imgDisplay0_title).innerHTML = title; $(imgDisplay0_caption).innerHTML = caption; $(imgDisplay0_number).innerHTML = 1 of + imgs0Slideshow.length + Articles; should be $(imgDisplay0_title).html(title); $(imgDisplay0_caption).html(caption); $(imgDisplay0_number).html('1 of ' + imgs0Slideshow.length + ' Articles'); or $(imgDisplay0_title).text(title); $(imgDisplay0_caption).text(caption); $(imgDisplay0_number).text('1 of ' + imgs0Slideshow.length + ' Articles'); or $(imgDisplay0_title).get(0).innerHTML = title; $(imgDisplay0_caption).get(0).innerHTML = caption; $(imgDisplay0_number).get(0).innerHTML = 1 of + imgs0Slideshow.length + Articles; or $(imgDisplay0_title)[0].innerHTML = title; $(imgDisplay0_caption)[0].innerHTML = caption; $(imgDisplay0_number)[0].innerHTML = 1 of + imgs0Slideshow.length + Articles; .html('text'); is the standard jQuery way to do add html, but is slower then .text which is the jQuery way to add plain text, which is slower then .innerHTML, but not by significant amounts unless you are in a big loop. .html() also handles removing events from DOM Elements that are written over this way which prevents circular references that can cause memory leaks. but, if speed is a big factor and you don't have any events doing .get(0) or [0] work. The problem is that $() returns a jQuery collection not a DOM object with the .innerHTML method. .get(0) or [0] will return the first element in the jQuery collection which is the DOM node you are looking for with the innerHTML method. Hope that helps. Josh Powell On Feb 7, 10:10 pm, MH1988 m.lawrencehu...@gmail.com wrote: I hope I am able to still receive assistance even though this isn't jQuery 100% and what I have is an image gallery I am using. The only thing I need to work out is how to make sure the initial title and captions appear when you load the webpage? script type='text/javascript' var imgs0Slideshow = new Array(); var imgs0; imgs0Slideshow[0] = new Object(); imgs0Slideshow[0].image = ; imgs0Slideshow[0].title = ; imgs0Slideshow[0].caption = shshshshshsh; imgs0Slideshow[1] = new Object(); imgs0Slideshow[1].image = ; imgs0Slideshow[1].title = Array; imgs0Slideshow[1].caption = shshshshs; imgs0Slideshow[2] = new Object(); imgs0Slideshow[2].image = ; imgs0Slideshow[2].title = ; imgs0Slideshow[2].caption = shshshsh; var start = 0; imgs0 = new MudFadeGallery('imgs0', 'imgDisplay0', imgs0Slideshow, {startNum: start, preload: true, autoplay: 4}); var title = (imgs0Slideshow[0].title) ? imgs0Slideshow[0].title : No Title; var caption = (imgs0Slideshow[0].caption) ? imgs0Slideshow [0].caption : No caption; $(imgDisplay0_title).innerHTML = title; $(imgDisplay0_caption).innerHTML = caption; $(imgDisplay0_number).innerHTML = 1 of + imgs0Slideshow.length + Articles; $(imgDisplay0).src = imgs0Slideshow[start].image; /script The entire Gallery works correctly but I am not sure if the last part of the script is structured correctly. When it is first loaded, the first image does appear but without it's title and captions and I want to show it.