javascript - A sticky situation for jQuery slideshow -

-

i'm required develop slideshow (not existing one) jquery. able change picture function created named changepic (takes image link). incorporates fading animation jquery library.

for slideshow i'm trying use while loop. kind of works, except doesn't wait animation finish.

how i, a) wait animation finish, b) delay changing picture display picture couple of seconds?

also tried settimeout, , doesn't work.

edit:

basically changing image this:

function changepic(imglink){     var imgnode = document.getelementbyid("galleryimg");     $(imgnode).fadeto(500, 0, function(){         $(imgnode).attr("src", imglink);         $(imgnode).fadeto(1000, 1);     }) }

and slideshow code this, shouldn't.

function slideshow(gallerylinks){     var i=0;     while (i<gallerylinks.length){         changepic(gallerylinks[i]);         i++;     } }

you try ditching while loop, , going perpetually recursive function...

on .animate, add timeout function (at whatever interval) calls changepic function. have no idea code looks like, provide fantastically generic outline.

/* array of imgurls */  var imgurls = new array(); //populate changepic(slidetoshowindex, fadeoutspeed, fadeinspeed, slidedelay) {    $('#slideholder').animate({ opacity: 0}, fadeoutspeed , function(){         $('#slideholder').attr('src', imgurls[slidetoshowindex]);         $('#slideholder').animate({ opacity: 1 }, fadeinspeed, function() {             settimeout(function() { changepic(slidetoshowindex+1, fadeoutspeed, fadeinspeed, slidedelay);}, slidedelay});         });    }}); }  $(document).ready(function() { changepic(0, 5000, 5000, 10000); });

this should (in theory) fade image out, swap new one, , fade in (both taking 5 seconds) , adding delay call next slide index in 10 seconds.

this in no way perfect, outline general idea. since have no idea code looks like, can assume settimeout in wrong spot. doing make sure animation has finished before timeout set. guarantees slide wont change until after animation has changed.

of course use combination of ':not(:animated)' selector , setinterval achieve same effect.

edit: made slight change stack animations properly. thoery behind still works ops addition of code.


Comments

Post a Comment

Popular posts from this blog

c++ - How do I get a multi line tooltip in MFC -

-
right now, have tool tip pops when hover on edit box. problem tool tip contains multiple error messages , in 1 long line. need have each error message on own line. error messages contained in cstring new line seperating them. my existing code below. bool ontooltiptext(uint, nmhdr* pnmhdr, lresult* presult) { assert(pnmhdr->code == ttn_needtexta || pnmhdr->code == ttn_needtextw); // need handle both ansi , unicode versions of message tooltiptexta* pttta = (tooltiptexta*)pnmhdr; tooltiptextw* ptttw = (tooltiptextw*)pnmhdr; // tchar szfulltext[256]; cstring strtiptext=_t(""); uint nid = pnmhdr->idfrom; if (pnmhdr->code == ttn_needtexta && (pttta->uflags & ttf_idishwnd) || pnmhdr->code == ttn_needtextw && (ptttw->uflags & ttf_idishwnd)) { // idfrom hwnd of tool nid = ::getdlgctrlid((hwnd)nid); } //m_errprojaccel[ch] contains 1 or more error messages each...
Read more

asp.net - In javascript how to find the height and width -

-
i having .aspx , masterpage page. in masterpage loading aspx page . in aspx page design using generating table structure using code-behind server in javascript how find height , width . regards, kumar if you're looking table height , width, should it var tbl = document.getelementbyid('tbldemo'); alert(tbl.offsetwidth + '\n' + tbl.offsetheight);
Read more

c# - DataTable to EnumerableRowCollection -

-
i have datatable according client requirement can contain invalid date "00/00/1999",null,empty string.(typed datset) when collect them enumerables wish convert of invalid forms empty string. (i.e) enumerablerowcollection<datarow> query = order in _table.asenumerable() select new { orderdate= string.isnullorempty(convert.tostring(order.field<datetime>("orderdate")) || (how check date invalid date) ? string.empty : order.field<datetime>("orderdate") } how check whether date valid date or not? datetime.tryparse...like given current code: datetime date; enumerablerowcollection<datarow> query = order in _table.asenumerable() select new { orderdate= string.isnullorempty(convert.tostring(order.field<datetime>("orderdate")) || !datetime.tryparse(convert.tostring(order.field<datetime...
Read more