[jQuery] Re: jcarousel and text below image
Hi,
Any more help on this please. Had no response since for weeks. I would
realy apreciate the help. I looked up a lot of tutorials and stuff,
and does not matter what I try, I do not manage to get it to work.
Thanks.
Hugo
On Apr 18, 11:47 am, "globalpropertyonline@gmail.com"
wrote:
> Hi Jay,
>
> Thanks for the help before but could you please be so kind to see me
> latest post below to brian and see what I have done so far and tell me
> where I am going wrong as I am still stuck with the text.
>
> I will realy apreciate it.
>
> Thanks
>
> Hugo
>
> On Apr 11, 12:49 am, jay wrote:
>
>
>
> > You can put it at the very bottom and wrap it with tags, or
> > you could put it in the head in script tags like this:
> > <head>
> > <script>
> > $(function(){
> > ..onload code goes here..});
>
> >
> >
>
> > Also $(document.body).appendChild(div); can go after the div is
> > declared instead. I would suggest you perhaps read some books/
> > tutorials on javascript and/or jquery to learn more. It is very
> > different from ASP since ASP is server-side code and javascript is
> > client-side.
>
> > On Apr 10, 4:01 pm, "globalpropertyonline@gmail.com"
>
> > wrote:
> > > Me again
>
> > > I tried your code here like this. but it does not seem to work. Any
> > > pointers ???
>
> > >
>
> > > function mycarousel_itemLoadCallback(carousel, state)
> > > {
> > > for (var i = carousel.first; i <= carousel.last; i++) {
> > > if (carousel.has(i)) {
> > > continue;
> > > }
>
> > > if (i > mycarousel_itemList.length) {
> > > break;
> > > }
>
> > > // Create an object from HTML
> > > var item = jQuery(mycarousel_getItemHTML(mycarousel_itemList
> > > [i-1])).get(0);
>
> > > // Apply thickbox
> > > tb_init(item);
>
> > > carousel.add(i, item);
> > > }
>
> > > };
>
> > > /**
> > > * Item html creation helper.
> > > */
> > > function mycarousel_getItemHTML(item)
> > > {
> > > var url_m = item.url.replace(/_s.jpg/g, '_m.jpg');
>
> > > return '<a href="' + url_m + '" title="' + item.title + '"
> > > myrefval="' + item.myref + '" mydescval="' + item.mydesc + '"
> > > myCountryURLval="' + item.myCountryURL + '" myCountryval="' +
> > > item.myCountry + '" myRegionval="' + item.myRegion + '" myTownval="' +
> > > item.myTown + '" myTermval="' + item.myTerm + '" myAreaval="' +
> > > item.myArea + '" myagentcodeval="' + item.myagentcode + '"><img src="'
> > > + item.url + '" width="175" height="125" border="0" alt="' +
> > > item.title + '" /></a>';
>
> > > div = $("<div style='display:none'>blah</div>")
>
> > > };
>
> > > jQuery(document).ready(function() {
> > > jQuery('#mycarousel').jcarousel({
> > > size: mycarousel_itemList.length,
> > > itemLoadCallback: {onBeforeAnimation:
> > > mycarousel_itemLoadCallback}
> > > });
>
> > > });
>
> > > jcarousel.find("img")
> > > .hover(
> > > function(){
> > > div.css({display:'block',position:'absolute',left:$(this).offset
> > > ().left, top:$(this).offset().top+$(this).height()});
> > > $(document.body).appendChild(div);
>
> > > },
>
> > > function(){
> > > div.css({display:'none'});
>
> > > });
>
> > >
>
> > > On Apr 10, 8:50 pm, "globalpropertyonline@gmail.com"
>
> > > wrote:
> > > > Thank you for taking the time to respond to my question
>
> > > > I am not vary good at Javascript and I am learning as I am going
> > > > along. I do most of my stuff with ASP.
>
> > > > Could you be so kind to tell me where I would place this code in the
> > > > code that I supplied ?
>
> > > > I managed to get this working by changing things and refresh. Takes me
> > > > a long time, but I lea
[jQuery] jcarousel and text below image
Hi,
I am playing with jcarousel and trying to show text below my images.
Like for example the reference nr or name of the image.
I am showing images of properties from my database and allow the user
to scroll through the properties. If they like one, they can click on
it and it will then show a page with more details on it.
I have tried to add text but it seems to show only one character that
I can see because it is behine the next image. I have then tried to
use the tagg but this does not move the text down.
Here is my code and would you be so kind to try and help me or point
me in the right direction.
I am not sure if you can add the text here or If I have to add it in
the jquery.jcarousel.js
You can see the test URL here and would apreciate any help or advice.
http://www.somewhere2rent.com/test/
I am not sure what to change in the stylesheet, have tried to make
some options bigger or smaller but do not realy know.
Below is code that I have tried to add text to.
return 'My text
here ???';
return 'My
text here ???';
function mycarousel_itemLoadCallback(carousel, state)
{
for (var i = carousel.first; i <= carousel.last; i++) {
if (carousel.has(i)) {
continue;
}
if (i > mycarousel_itemList.length) {
break;
}
// Create an object from HTML
var item = jQuery(mycarousel_getItemHTML(mycarousel_itemList[i-1])).get
(0);
// Apply thickbox
tb_init(item);
carousel.add(i, item);
}
};
/**
* Item html creation helper.
*/
function mycarousel_getItemHTML(item)
{
var url_m = item.url.replace(/_s.jpg/g, '_m.jpg');
return '
';
};
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel({
size: mycarousel_itemList.length,
itemLoadCallback: {onBeforeAnimation: mycarousel_itemLoadCallback}
});
});
.jcarousel-skin-ie7 .jcarousel-container {
-moz-border-radius: 10px;
background: #D4D0C8;
border: 2px solid #808080;
}
.jcarousel-skin-ie7 .jcarousel-container-horizontal {
width: 545px;
padding: 20px 40px;
}
.jcarousel-skin-ie7 .jcarousel-container-vertical {
width: 200px;
height: 545px;
padding: 40px 20px;
}
.jcarousel-skin-ie7 .jcarousel-clip-horizontal {
width: 545px;
height: 130px;
}
.jcarousel-skin-ie7 .jcarousel-clip-vertical {
width: 180px;
height: 130px;
}
.jcarousel-skin-ie7 .jcarousel-item {
width: 175px;
height: 125px;
border: 1px solid #fff;
}
.jcarousel-skin-ie7 .jcarousel-item:hover {
border-color: #808080;
}
.jcarousel-skin-ie7 .jcarousel-item-horizontal {
margin-right: 7px;
}
.jcarousel-skin-ie7 .jcarousel-item-vertical {
margin-bottom: 7px;
}
.jcarousel-skin-ie7 .jcarousel-item-placeholder {
}
/**
* Horizontal Buttons
*/
.jcarousel-skin-ie7 .jcarousel-next-horizontal {
position: absolute;
top: 65px;
right: 5px;
width: 32px;
height: 32px;
cursor: pointer;
background: transparent url(next-horizontal.gif) no-repeat 0 0;
}
.jcarousel-skin-ie7 .jcarousel-next-horizontal:hover {
background-position: -32px 0;
}
.jcarousel-skin-ie7 .jcarousel-next-horizontal:active {
background-position: -64px 0;
}
.jcarousel-skin-ie7 .jcarousel-next-disabled-horizontal,
.jcarousel-skin-ie7 .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-ie7 .jcarousel-next-disabled-horizontal:active {
cursor: default;
background-position: -96px 0;
}
.jcarousel-skin-ie7 .jcarousel-prev-horizontal {
position: absolute;
top: 65px;
left: 5px;
width: 32px;
height: 32px;
cursor: pointer;
background: transparent url(prev-horizontal.gif) no-repeat 0 0;
}
.jcarousel-skin-ie7 .jcarousel-prev-horizontal:hover {
background-position: -32px 0;
}
.jcarousel-skin-ie7 .jcarousel-prev-horizontal:active {
background-position: -64px 0;
}
.jcarousel-skin-ie7 .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-ie7 .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-ie7 .jcarousel-prev-disabled-horizontal:active {
cursor: default;
background-position: -96px 0;
}
/**
* Vertical Buttons
*/
.jcarousel-skin-ie7 .jcarousel-next-vertical {
position: absolute;
bottom: 5px;
left: 43px;
width: 32px;
height: 32px;
cursor: pointer;
background: transparent url(next-vertical.gif) no-repeat 0 0;
}
.jcarousel-skin-ie7 .jcarousel-next-vertical:hover {
background-position: 0 -32px;
}
.jcarousel-skin-ie7 .jcarousel-next-vertical:active {
background-position: 0 -64px;
}
.jcarousel-skin-ie7 .jcarousel-next-disabled-vertical,
.jcarousel-skin-ie7 .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-ie7 .jcarousel-next-disabled-vertical:active {
cursor: default;
[jQuery] Re: jcarousel and text below image
Thank you for taking the time to respond to my question
I am not vary good at Javascript and I am learning as I am going
along. I do most of my stuff with ASP.
Could you be so kind to tell me where I would place this code in the
code that I supplied ?
I managed to get this working by changing things and refresh. Takes me
a long time, but I learn
If you could tell me where to PLACE THIS CODE AND SEE IT IN ACTION, i
CAN THEN TRY TO SEE WHAT TO DO AND HOW TO CHANGE IT...
div = $("blah")
jcarousel.find("img")
.hover(
function(){
div.css({display:'block',position:'absolute',left:$(this).offset
().left, top:$(this).offset().top+$(this).height()});
$(document.body).appendChild(div);
},
function(){
div.css({display:'none'});
});
OR IF YOU CAN, show me how to implement this bit, I will so greatfull.
Since the image elements are sort of dynamic it might be better to
use
live events with mouseover/mouseout, or mousemove
Thnak you again for your time.
Hugo
On Apr 10, 8:22 pm, jay wrote:
> If you want it directlybelowtheimagethe easiest thing to do would
> be to position it absolutely to this position when you hover over theimage.
> Something like this might work:
>
> div = $("blah")
>
> jcarousel.find("img")
> .hover(
> function(){
> div.css({display:'block',position:'absolute',left:$(this).offset
> ().left, top:$(this).offset().top+$(this).height()});
> $(document.body).appendChild(div);},
>
> function(){
> div.css({display:'none'});
>
> });
>
> Since theimageelements are sort of dynamic it might be better to use
> live events with mouseover/mouseout, or mousemove
>
> On Apr 10, 9:54 am, "globalpropertyonline@gmail.com"
>
>
>
> wrote:
> > Hi,
>
> > I am playing withjcarouseland trying to showtextbelowmy images.
> > Like for example the reference nr or name of theimage.
>
> > I am showing images of properties from my database and allow the user
> > to scroll through the properties. If they like one, they can click on
> > it and it will then show a page with more details on it.
>
> > I have tried to addtextbut it seems to show only one character that
> > I can see because it is behine the nextimage. I have then tried to
> > use the tagg but this does not move thetextdown.
>
> > Here is my code and would you be so kind to try and help me or point
> > me in the right direction.
>
> > I am not sure if you can add thetexthere or If I have to add it in
> > the jquery.jcarousel.js
>
> > You can see the test URL here and would apreciate any help or advice.
>
> >http://www.somewhere2rent.com/test/
>
> > I am not sure what to change in the stylesheet, have tried to make
> > some options bigger or smaller but do not realy know.
>
> >Belowis code that I have tried to addtextto.
>
> > return ' > myRegionval="' + item.myRegion + '" myTownval="' + item.myTown + '"
> > myTermval="' + item.myTerm + '" myAreaval="' + item.myArea + '"
> > myagentcodeval="' + item.myagentcode + '"> > width="175" height="125" border="0" alt="' + item.title + '" />Mytext
> > here ???';
>
> > return ' > myRegionval="' + item.myRegion + '" myTownval="' + item.myTown + '"
> > myTermval="' + item.myTerm + '" myAreaval="' + item.myArea + '"
> > myagentcodeval="' + item.myagentcode + '"> > width="175" height="125" border="0" alt="' + item.title + '" />My
> >texthere ???';
>
> >
>
> > function mycarousel_itemLoadCallback(carousel, state)
>
> > {
>
> > for (var i = carousel.first; i <= carousel.last; i++) {
>
> > if (carousel.has(i)) {
>
> > continue;
>
> > }
>
> > if (i > mycarousel_itemList.length) {
>
> > break;
>
> > }
>
> > // Create an object from HTML
>
> > var item = jQuery(mycarousel_getItemHTML(mycarousel_itemList[i-1])).get
> > (0);
>
> > // Apply thickbox
>
> > tb_init(item);
>
> > carousel.add(i, item);
>
> > }
> > };
>
> > /**
>
> > * Item html creation helper.
>
> > */
>
> > function mycarousel_getItemHTML(item)
>
> > {
>
> > var url_m = item.url.replace(/_s.jpg/g, '_m.jpg');
>
> > return '<a href="' + url_m + '" title="' +
[jQuery] Re: jcarousel and text below image
Me again
I tried your code here like this. but it does not seem to work. Any
pointers ???
function mycarousel_itemLoadCallback(carousel, state)
{
for (var i = carousel.first; i <= carousel.last; i++) {
if (carousel.has(i)) {
continue;
}
if (i > mycarousel_itemList.length) {
break;
}
// Create an object from HTML
var item = jQuery(mycarousel_getItemHTML(mycarousel_itemList
[i-1])).get(0);
// Apply thickbox
tb_init(item);
carousel.add(i, item);
}
};
/**
* Item html creation helper.
*/
function mycarousel_getItemHTML(item)
{
var url_m = item.url.replace(/_s.jpg/g, '_m.jpg');
return '<a href="' + url_m + '" title="' + item.title + '"
myrefval="' + item.myref + '" mydescval="' + item.mydesc + '"
myCountryURLval="' + item.myCountryURL + '" myCountryval="' +
item.myCountry + '" myRegionval="' + item.myRegion + '" myTownval="' +
item.myTown + '" myTermval="' + item.myTerm + '" myAreaval="' +
item.myArea + '" myagentcodeval="' + item.myagentcode + '"><img src="'
+ item.url + '" width="175" height="125" border="0" alt="' +
item.title + '" /></a>';
div = $("<div style='display:none'>blah</div>")
};
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel({
size: mycarousel_itemList.length,
itemLoadCallback: {onBeforeAnimation:
mycarousel_itemLoadCallback}
});
});
jcarousel.find("img")
.hover(
function(){
div.css({display:'block',position:'absolute',left:$(this).offset
().left, top:$(this).offset().top+$(this).height()});
$(document.body).appendChild(div);
},
function(){
div.css({display:'none'});
});
On Apr 10, 8:50 pm, "globalpropertyonline@gmail.com"
wrote:
> Thank you for taking the time to respond to my question
>
> I am not vary good at Javascript and I am learning as I am going
> along. I do most of my stuff with ASP.
>
> Could you be so kind to tell me where I would place this code in the
> code that I supplied ?
>
> I managed to get this working by changing things and refresh. Takes me
> a long time, but I learn
>
> If you could tell me where to PLACE THIS CODE AND SEE IT IN ACTION, i
> CAN THEN TRY TO SEE WHAT TO DO AND HOW TO CHANGE IT...
>
> div = $("blah")
>
> jcarousel.find("img")
> .hover(
> function(){
> div.css({display:'block',position:'absolute',left:$(this).offset
> ().left, top:$(this).offset().top+$(this).height()});
> $(document.body).appendChild(div);
>
> },
>
> function(){
> div.css({display:'none'});
>
> });
>
> OR IF YOU CAN, show me how to implement this bit, I will so greatfull.
>
> Since theimageelements are sort of dynamic it might be better to
> use
> live events with mouseover/mouseout, or mousemove
>
> Thnak you again for your time.
>
> Hugo
>
> On Apr 10, 8:22 pm, jay wrote:
>
>
>
> > If you want it directlybelowtheimagethe easiest thing to do would
> > be to position it absolutely to this position when you hover over theimage.
> > Something like this might work:
>
> > div = $("blah")
>
> >jcarousel.find("img")
> > .hover(
> > function(){
> > div.css({display:'block',position:'absolute',left:$(this).offset
> > ().left, top:$(this).offset().top+$(this).height()});
> > $(document.body).appendChild(div);},
>
> > function(){
> > div.css({display:'none'});
>
> > });
>
> > Since theimageelements are sort of dynamic it might be better to use
> > live events with mouseover/mouseout, or mousemove
>
> > On Apr 10, 9:54 am, "globalpropertyonline@gmail.com"
>
> > wrote:
> > > Hi,
>
> > > I am playing withjcarouseland trying to showtextbelowmy images.
> > > Like for example the reference nr or name of theimage.
>
> > > I am showing images of properties from my database and allow the user
> > > to scroll through the properties. If they like one, they can click on
> > > it and it will then show a page with more details on it.
>
> > > I have tried to addtextbut it seems to show only one character that
> > > I can see because it is behine the nextimage. I have then tried to
> > > use the tagg but this does not move thetextdown.
>
&g
[jQuery] Re: jcarousel and text below image
Thanks Jay,
I have put a function Load() in the head and called it in body onload.
and then add the two lines in Javascript just below the Div is
declared but it seems to have a javascript error and no Bla is
displayed.
I tried to change a few things but no luck.
This is what I have done.
function load()
{
jcarousel.find("img")
.hover(
function(){
div.css({display:'block',position:'absolute',left:$(this).offset
().left, top:$(this).offset().top+$(this).height()});
},
function(){
div.css({display:'none'});
});
}
div = $("<div style='display:none'>blah</div>");
$(document.body).appendChild(div);
On Apr 11, 12:49 am, jay wrote:
> You can put it at the very bottom and wrap it with tags, or
> you could put it in the head in script tags like this:
> <head>
> <script>
> $(function(){
> ..onload code goes here..});
>
>
>
>
> Also $(document.body).appendChild(div); can go after the div is
> declared instead. I would suggest you perhaps read some books/
> tutorials on javascript and/or jquery to learn more. It is very
> different from ASP since ASP is server-side code and javascript is
> client-side.
>
> On Apr 10, 4:01 pm, "globalpropertyonline@gmail.com"
>
>
>
> wrote:
> > Me again
>
> > I tried your code here like this. but it does not seem to work. Any
> > pointers ???
>
> >
>
> > function mycarousel_itemLoadCallback(carousel, state)
> > {
> > for (var i = carousel.first; i <= carousel.last; i++) {
> > if (carousel.has(i)) {
> > continue;
> > }
>
> > if (i > mycarousel_itemList.length) {
> > break;
> > }
>
> > // Create an object from HTML
> > var item = jQuery(mycarousel_getItemHTML(mycarousel_itemList
> > [i-1])).get(0);
>
> > // Apply thickbox
> > tb_init(item);
>
> > carousel.add(i, item);
> > }
>
> > };
>
> > /**
> > * Item html creation helper.
> > */
> > function mycarousel_getItemHTML(item)
> > {
> > var url_m = item.url.replace(/_s.jpg/g, '_m.jpg');
>
> > return '<a href="' + url_m + '" title="' + item.title + '"
> > myrefval="' + item.myref + '" mydescval="' + item.mydesc + '"
> > myCountryURLval="' + item.myCountryURL + '" myCountryval="' +
> > item.myCountry + '" myRegionval="' + item.myRegion + '" myTownval="' +
> > item.myTown + '" myTermval="' + item.myTerm + '" myAreaval="' +
> > item.myArea + '" myagentcodeval="' + item.myagentcode + '"><img src="'
> > + item.url + '" width="175" height="125" border="0" alt="' +
> > item.title + '" /></a>';
>
> > div = $("<div style='display:none'>blah</div>")
>
> > };
>
> > jQuery(document).ready(function() {
> > jQuery('#mycarousel').jcarousel({
> > size: mycarousel_itemList.length,
> > itemLoadCallback: {onBeforeAnimation:
> > mycarousel_itemLoadCallback}
> > });
>
> > });
>
> >jcarousel.find("img")
> > .hover(
> > function(){
> > div.css({display:'block',position:'absolute',left:$(this).offset
> > ().left, top:$(this).offset().top+$(this).height()});
> > $(document.body).appendChild(div);
>
> > },
>
> > function(){
> > div.css({display:'none'});
>
> > });
>
> >
>
> > On Apr 10, 8:50 pm, "globalpropertyonline@gmail.com"
>
> > wrote:
> > > Thank you for taking the time to respond to my question
>
> > > I am not vary good at Javascript and I am learning as I am going
> > > along. I do most of my stuff with ASP.
>
> > > Could you be so kind to tell me where I would place this code in the
> > > code that I supplied ?
>
> > > I managed to get this working by changing things and refresh. Takes me
> > > a long time, but I learn
>
> > > If you could tell me where to PLACE THIS CODE AND SEE IT IN ACTION, i
> > > CAN THEN TRY TO SEE WHAT TO DO AND HOW TO CHANGE IT...
>
> > > div = $("blah")
>
> > >jcarousel.find("img")
> > > .hover(
> >
[jQuery] Re: jcarousel and text below image
Thanks for the response Jay.
I have now added the function as follows in the head and tried the
following two lines at three different places but still no luck. The
errors seems to have gone away now , but I do not see the Bla.
div = $("blah");
$(document.body).appendChild(div);
1) I have put the two lines in the function but no luck,
2) I have put the two lines in the fuction below the Return HTML Get
Element but no luck.
3) I have put it in its own javascript tags below the declaration of
the div as it is but no luck.
This is the function now in the head. You can see my code source here.
http://www.somewhere2rent.com/test/
I have also made the image smaller just in case the text is behind the
image.
$(function()
{
whatever(); {
jcarousel.find("img")
.hover(
function(){
div.css({display:'block',position:'absolute',left:$(this).offset
().left, top:$(this).offset().top+$(this).height()});
},
function(){
div.css({display:'none'});
});
},
});
div = $("<div style='display:none'>blah</div>");
$(document.body).appendChild(div);
ANy more help will be apreciated.
Thanks
On Apr 11, 4:29 am, brian wrote:
> There's no need for body onload="" when using jquery. As long as the
> library is included, you need only do:
>
> $(function()
> {
> whatever();
>
> });
>
> Here, the whatever() function will run as soon as the DOM is loaded
> (generally, this occurs before the page is displayed).
>
> On Fri, Apr 10, 2009 at 11:07 PM, globalpropertyonline@gmail.com
>
>
>
> wrote:
>
> > Thanks Jay,
>
> > I have put a function Load() in the head and called it in body onload.
> > and then add the two lines in Javascript justbelowthe Div is
> > declared but it seems to have a javascript error and no Bla is
> > displayed.
>
> > I tried to change a few things but no luck.
>
> > This is what I have done.
>
> >
> > function load()
> > {
>
> >jcarousel.find("img")
> > .hover(
> > function(){
> > div.css({display:'block',position:'absolute',left:$(this).offset
> > ().left, top:$(this).offset().top+$(this).height()});
> > },
>
> > function(){
> > div.css({display:'none'});
> > });
>
> > }
> >
>
> >
>
> >
>
> >
>
> >
>
> > div = $("<div style='display:none'>blah</div>");
> > $(document.body).appendChild(div);
>
> >
>
> >
> >
> >
>
> >
>
> > On Apr 11, 12:49 am, jay wrote:
> >> You can put it at the very bottom and wrap it with tags, or
> >> you could put it in the head in script tags like this:
> >> <head>
> >> <script>
> >> $(function(){
> >> ..onload code goes here..});
>
> >>
> >>
>
> >> Also $(document.body).appendChild(div); can go after the div is
> >> declared instead. I would suggest you perhaps read some books/
> >> tutorials on javascript and/or jquery to learn more. It is very
> >> different from ASP since ASP is server-side code and javascript is
> >> client-side.
>
> >> On Apr 10, 4:01 pm, "globalpropertyonline@gmail.com"
>
> >> wrote:
> >> > Me again
>
> >> > I tried your code here like this. but it does not seem to work. Any
> >> > pointers ???
>
> >> >
>
> >> > function mycarousel_itemLoadCallback(carousel, state)
> >> > {
> >> > for (var i = carousel.first; i <= carousel.last; i++) {
> >> > if (carousel.has(i)) {
> >> > continue;
> >> > }
>
> >> > if (i > mycarousel_itemList.length) {
> >> > break;
> >> > }
>
> >> > // Create an object from HTML
> >> > var item = jQuery(mycarousel_getItemHTML(mycarousel_itemList
> >> > [i-1])).get(0);
>
> >> > // Apply thickbox
> >> > tb_init(item);
>
> >> > carousel.add(i, item);
> >> > }
>
> >> > };
>
> >> > /**
> >> > * Item html creation helper.
> >> > */
> >> > function mycarousel_getItemHTML(item)
> >> > {
> >> > var url_m = item.url.replace(/_s.jpg/g, '_m.jpg');
>
> >> > return '<a href="' + url_m + '" title="' + item.title + &#x
[jQuery] Re: jcarousel and text below image
Hi Jay,
Hope you had a good Easter Weekend. Any more help on my previous post
will be much apreciated as I am still stuck with the same thing.
Thanks in advance for your help.
Hugo
On Apr 11, 8:36 am, "globalpropertyonline@gmail.com"
wrote:
> Thanks for the response Jay.
>
> I have now added the function as follows in the head and tried the
> following two lines at three different places but still no luck. The
> errors seems to have gone away now , but I do not see the Bla.
>
> div = $("blah");
> $(document.body).appendChild(div);
>
> 1) I have put the two lines in the function but no luck,
> 2) I have put the two lines in the fuction below the Return HTML Get
> Element but no luck.
> 3) I have put it in its own javascript tags below the declaration of
> the div as it is but no luck.
>
> This is the function now in the head. You can see my code source
> here.http://www.somewhere2rent.com/test/
>
> I have also made the image smaller just in case the text is behind the
> image.
>
>
>
> $(function()
> {
> whatever(); {
>
> jcarousel.find("img")
> .hover(
> function(){
> div.css({display:'block',position:'absolute',left:$(this).offset
> ().left, top:$(this).offset().top+$(this).height()});
>
> },
>
> function(){
> div.css({display:'none'});
>
> });
> },
> });
>
>
>
>
>
>
>
>
>
> div = $("<div style='display:none'>blah</div>");
> $(document.body).appendChild(div);
>
>
>
>
>
>
>
>
>
>
>
>
> ANy more help will be apreciated.
>
> Thanks
>
> On Apr 11, 4:29 am, brian wrote:
>
>
>
> > There's no need for body onload="" when using jquery. As long as the
> > library is included, you need only do:
>
> > $(function()
> > {
> > whatever();
>
> > });
>
> > Here, the whatever() function will run as soon as the DOM is loaded
> > (generally, this occurs before the page is displayed).
>
> > On Fri, Apr 10, 2009 at 11:07 PM, globalpropertyonline@gmail.com
>
> > wrote:
>
> > > Thanks Jay,
>
> > > I have put a function Load() in the head and called it in body onload.
> > > and then add the two lines in Javascript justbelowthe Div is
> > > declared but it seems to have a javascript error and no Bla is
> > > displayed.
>
> > > I tried to change a few things but no luck.
>
> > > This is what I have done.
>
> > >
> > > function load()
> > > {
>
> > >jcarousel.find("img")
> > > .hover(
> > > function(){
> > > div.css({display:'block',position:'absolute',left:$(this).offset
> > > ().left, top:$(this).offset().top+$(this).height()});
> > > },
>
> > > function(){
> > > div.css({display:'none'});
> > > });
>
> > > }
> > >
>
> > >
>
> > >
>
> > >
>
> > >
>
> > > div = $("<div style='display:none'>blah</div>");
> > > $(document.body).appendChild(div);
>
> > >
>
> > >
> > >
> > >
>
> > >
>
> > > On Apr 11, 12:49 am, jay wrote:
> > >> You can put it at the very bottom and wrap it with tags, or
> > >> you could put it in the head in script tags like this:
> > >> <head>
> > >> <script>
> > >> $(function(){
> > >> ..onload code goes here..});
>
> > >>
> > >>
>
> > >> Also $(document.body).appendChild(div); can go after the div is
> > >> declared instead. I would suggest you perhaps read some books/
> > >> tutorials on javascript and/or jquery to learn more. It is very
> > >> different from ASP since ASP is server-side code and javascript is
> > >> client-side.
>
> > >> On Apr 10, 4:01 pm, "globalpropertyonline@gmail.com"
>
> > >> wrote:
> > >> > Me again
>
> > >> > I tried your code here like this. but it does not seem to work. Any
> > >> > pointers ???
>
> > >> >
>
> > >> > function mycarousel_itemLoadCallback(carousel, state)
> > >> > {
> > >> > for (var i = carousel.first; i <= carousel.last; i++) {
> > >> > if (carousel.has(i)) {
> > >> > continue;
> > >> >
[jQuery] Problem to get Text displayed in jquery function
Hi All,
I have a function with jcarousel but for some reason, I just can not
get the text to show below my images in the Container.
One guy helped me with various options but as you can see below, I am
still stuck.
Any help ?
I have now added the function as follows in the head and tried the
following two lines at three different places but still no luck. The
errors seems to have gone away now , but I do not see the Bla.
div = $("blah");
$(document.body).appendChild(div);
1) I have put the two lines in the function but no luck,
2) I have put the two lines in the fuction below the Return HTML Get
Element but no luck.
3) I have put it in its own javascript tags below the declaration of
the div as it is but no luck.
This is the function now in the head. You can see my code source
here.
http://www.somewhere2rent.com/test/
I have also made the image smaller just in case the text is behind
the
image.
$(function()
{
whatever(); {
jcarousel.find("img")
.hover(
function(){
div.css({display:'block',position:'absolute',left:$(this).offset
().left, top:$(this).offset().top+$(this).height()});
},
function(){
div.css({display:'none'});
});
},
});
div = $("");
$(document.body).appendChild(div);
ANy more help will be apreciated.
Thanks
[jQuery] Re: jcarousel and text below image
Thanks Brian.
Could you have a look at this and tell me where I am going wrong or
could you tell me where to place the information as I have done the
following and can still not get it right.
I will realy apreciate your help.
Thanks
Hugo
Here is what I have done :
I have now added the function as follows in the head and tried the
following two lines at three different places but still no luck. The
errors seems to have gone away now , but I do not see the Bla.
div = $("blah");
$(document.body).appendChild(div);
1) I have put the two lines in the function but no luck,
2) I have put the two lines in the fuction below the Return HTML Get
Element but no luck.
3) I have put it in its own javascript tags below the declaration of
the div as it is but no luck.
This is the function now in the head. You can see my code source
here.
http://www.somewhere2rent.com/test/
I have also made the image smaller just in case the text is behind
the
image.
$(function()
{
whatever(); {
jcarousel.find("img")
.hover(
function(){
div.css({display:'block',position:'absolute',left:$(this).offset
().left, top:$(this).offset().top+$(this).height()});
},
function(){
div.css({display:'none'});
});
},
});
div = $("<div style='display:none'>blah</div>");
$(document.body).appendChild(div);
ANy more help will be apreciated.
On Apr 11, 4:29 am, brian wrote:
> There's no need for body onload="" when using jquery. As long as the
> library is included, you need only do:
>
> $(function()
> {
> whatever();
>
> });
>
> Here, the whatever() function will run as soon as the DOM is loaded
> (generally, this occurs before the page is displayed).
>
> On Fri, Apr 10, 2009 at 11:07 PM, globalpropertyonline@gmail.com
>
>
>
> wrote:
>
> > Thanks Jay,
>
> > I have put a function Load() in the head and called it in body onload.
> > and then add the two lines in Javascript just below the Div is
> > declared but it seems to have a javascript error and no Bla is
> > displayed.
>
> > I tried to change a few things but no luck.
>
> > This is what I have done.
>
> >
> > function load()
> > {
>
> > jcarousel.find("img")
> > .hover(
> > function(){
> > div.css({display:'block',position:'absolute',left:$(this).offset
> > ().left, top:$(this).offset().top+$(this).height()});
> > },
>
> > function(){
> > div.css({display:'none'});
> > });
>
> > }
> >
>
> >
>
> >
>
> >
>
> >
>
> > div = $("<div style='display:none'>blah</div>");
> > $(document.body).appendChild(div);
>
> >
>
> >
> >
> >
>
> >
>
> > On Apr 11, 12:49 am, jay wrote:
> >> You can put it at the very bottom and wrap it with tags, or
> >> you could put it in the head in script tags like this:
> >> <head>
> >> <script>
> >> $(function(){
> >> ..onload code goes here..});
>
> >>
> >>
>
> >> Also $(document.body).appendChild(div); can go after the div is
> >> declared instead. I would suggest you perhaps read some books/
> >> tutorials on javascript and/or jquery to learn more. It is very
> >> different from ASP since ASP is server-side code and javascript is
> >> client-side.
>
> >> On Apr 10, 4:01 pm, "globalpropertyonline@gmail.com"
>
> >> wrote:
> >> > Me again
>
> >> > I tried your code here like this. but it does not seem to work. Any
> >> > pointers ???
>
> >> >
>
> >> > function mycarousel_itemLoadCallback(carousel, state)
> >> > {
> >> > for (var i = carousel.first; i <= carousel.last; i++) {
> >> > if (carousel.has(i)) {
> >> > continue;
> >> > }
>
> >> > if (i > mycarousel_itemList.length) {
> >> > break;
> >> > }
>
> >> > // Create an object from HTML
> >> > var item = jQuery(mycarousel_getItemHTML(mycarousel_itemList
> >> > [i-1])).get(0);
>
> >> > // Apply thickbox
> >> > tb_init(item);
>
> >> > carousel.add(i, item);
> >> > }
>
> >> > };
>
> >> > /**
> >> > * Item html creation helper.
> >> > */
> >> > function mycarousel_getItem
[jQuery] Re: jcarousel and text below image
Hi Jay,
Thanks for the help before but could you please be so kind to see me
latest post below to brian and see what I have done so far and tell me
where I am going wrong as I am still stuck with the text.
I will realy apreciate it.
Thanks
Hugo
On Apr 11, 12:49 am, jay wrote:
> You can put it at the very bottom and wrap it with tags, or
> you could put it in the head in script tags like this:
> <head>
> <script>
> $(function(){
> ..onload code goes here..});
>
>
>
>
> Also $(document.body).appendChild(div); can go after the div is
> declared instead. I would suggest you perhaps read some books/
> tutorials on javascript and/or jquery to learn more. It is very
> different from ASP since ASP is server-side code and javascript is
> client-side.
>
> On Apr 10, 4:01 pm, "globalpropertyonline@gmail.com"
>
>
>
> wrote:
> > Me again
>
> > I tried your code here like this. but it does not seem to work. Any
> > pointers ???
>
> >
>
> > function mycarousel_itemLoadCallback(carousel, state)
> > {
> > for (var i = carousel.first; i <= carousel.last; i++) {
> > if (carousel.has(i)) {
> > continue;
> > }
>
> > if (i > mycarousel_itemList.length) {
> > break;
> > }
>
> > // Create an object from HTML
> > var item = jQuery(mycarousel_getItemHTML(mycarousel_itemList
> > [i-1])).get(0);
>
> > // Apply thickbox
> > tb_init(item);
>
> > carousel.add(i, item);
> > }
>
> > };
>
> > /**
> > * Item html creation helper.
> > */
> > function mycarousel_getItemHTML(item)
> > {
> > var url_m = item.url.replace(/_s.jpg/g, '_m.jpg');
>
> > return '<a href="' + url_m + '" title="' + item.title + '"
> > myrefval="' + item.myref + '" mydescval="' + item.mydesc + '"
> > myCountryURLval="' + item.myCountryURL + '" myCountryval="' +
> > item.myCountry + '" myRegionval="' + item.myRegion + '" myTownval="' +
> > item.myTown + '" myTermval="' + item.myTerm + '" myAreaval="' +
> > item.myArea + '" myagentcodeval="' + item.myagentcode + '"><img src="'
> > + item.url + '" width="175" height="125" border="0" alt="' +
> > item.title + '" /></a>';
>
> > div = $("<div style='display:none'>blah</div>")
>
> > };
>
> > jQuery(document).ready(function() {
> > jQuery('#mycarousel').jcarousel({
> > size: mycarousel_itemList.length,
> > itemLoadCallback: {onBeforeAnimation:
> > mycarousel_itemLoadCallback}
> > });
>
> > });
>
> > jcarousel.find("img")
> > .hover(
> > function(){
> > div.css({display:'block',position:'absolute',left:$(this).offset
> > ().left, top:$(this).offset().top+$(this).height()});
> > $(document.body).appendChild(div);
>
> > },
>
> > function(){
> > div.css({display:'none'});
>
> > });
>
> >
>
> > On Apr 10, 8:50 pm, "globalpropertyonline@gmail.com"
>
> > wrote:
> > > Thank you for taking the time to respond to my question
>
> > > I am not vary good at Javascript and I am learning as I am going
> > > along. I do most of my stuff with ASP.
>
> > > Could you be so kind to tell me where I would place this code in the
> > > code that I supplied ?
>
> > > I managed to get this working by changing things and refresh. Takes me
> > > a long time, but I learn
>
> > > If you could tell me where to PLACE THIS CODE AND SEE IT IN ACTION, i
> > > CAN THEN TRY TO SEE WHAT TO DO AND HOW TO CHANGE IT...
>
> > > div = $("blah")
>
> > > jcarousel.find("img")
> > > .hover(
> > > function(){
> > > div.css({display:'block',position:'absolute',left:$(this).offset
> > > ().left, top:$(this).offset().top+$(this).height()});
> > > $(document.body).appendChild(div);
>
> > > },
>
> > > function(){
> > > div.css({display:'none'});
>
> > > });
>
> > > OR IF YOU CAN, show me how to implement this bit, I will so greatfull.
>
&
