cycle - jquery cycle2 initialisation script failing -


i can utilise jq cycle2 fine required options inline within div, preferred style. instead use initialisation script, old method of operation. prefer keep gallery options stuff out of markup , in external .js file wherever possible.

i've made script of options work 'inline' method , linking properly, silently fails , slideshow reverts default setting of fade whereas specify scrollhorz.

also i'm using previous/next buttons , animated cations - captions work without animation , prev/next buttons visible fail completely.

my script in file named 'functionality.js' , believe i've followed instructions 'custom initialisation script' as outlined in api. have relevant plugins in file called 'plugins.js' link fine , you'll see them referenced in console screengrab below.

please see following markup/script (it's straight copy of cycle2 example simplicity) , link console screengrab:

<a href="#"><span class="prevcontrol">prev</span></a> <a href="#"><span class="nextcontrol">next</span></a>  <div class="cycle-slideshow"> <img src="http://malsup.github.com/images/p1.jpg" data-cycle-title="spring" data-cycle-desc="sonnenberg gardens"/> <img src="http://malsup.github.com/images/p2.jpg" data-cycle-title="redwoods" data-cycle-desc="muir woods national monument"/> <img src="http://malsup.github.com/images/p3.jpg" data-cycle-title="angel island" data-cycle-desc="san franscisco bay"/> <img src="http://malsup.github.com/images/p4.jpg" data-cycle-title="raquette lake" data-cycle-desc="adirondack state park"/>  <div class="cycle-caption"></div> <div class="cycle-overlay"></div>  </div>

the linked script:

$('.cycle-slideshow').cycle({ fx: scrollhorz, timeout: 2000, speed: 700, prev: ".prevcontrol", next: ".nextcontrol", caption-plugin: caption2, overlay-fx-sel: "div" });

and here's link a screengrab of console error

if advise appreciated, i'm sure it's simple error!

thanks in advance

there's few simple mistakes in javascript causing cycle fail. when initalising slideshow programmatically, parameters need camelcase instead of using hyphens when they're specified using data attributes. need wrap string-based parameter values quotes otherwise script think variables. here's updated version of example works:

<!doctype html> <html lang="en"> <head>     <meta charset="utf-8">     <title>cycle2 example</title> </head> <body>     <a href="#"><span class="prevcontrol">prev</span></a>     <a href="#"><span class="nextcontrol">next</span></a>      <div class="slides">         <img src="http://malsup.github.com/images/p1.jpg" data-cycle-title="spring" data-cycle-desc="sonnenberg gardens"/>         <img src="http://malsup.github.com/images/p2.jpg" data-cycle-title="redwoods" data-cycle-desc="muir woods national monument"/>         <img src="http://malsup.github.com/images/p3.jpg" data-cycle-title="angel island" data-cycle-desc="san franscisco bay"/>         <img src="http://malsup.github.com/images/p4.jpg" data-cycle-title="raquette lake" data-cycle-desc="adirondack state park"/>          <div class="cycle-caption"></div>         <div class="cycle-overlay"></div>     </div>      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>     <script src="http://malsup.github.io/jquery.cycle2.js"></script>     <script>         $('.slides').cycle({             fx: "scrollhorz",             timeout: 2000,             speed: 700,             prev: ".prevcontrol",             next: ".nextcontrol",             captionplugin: "caption2",             overlayfxsel: "div"         });     </script> </body> </html>

i'd use id or class other cycle-slideshow when setting slideshow programmatically isn't auto initialised cycle plugin.


Comments

Post a Comment

Popular posts from this blog

monitor web browser programmatically in Android? -

i've got tricky question here. need users make payment bank (namely barclaycard) in uk. so, have https url , add parameters (such amount pay, order reference, etc) url, start http connection intent.actionview, redirect user browser can enter credit card details on bank's webpage , make payment our account successfully. far ? the code use below (i changed values privacy reasons) problem is, need app when user has completed/failed/cancelled payment. barclaycardautomatically redirects particular url when payment has succeeded, 1 if failed. there no way of knowing when barclaycard payment has succeeded go android app somehow ? button cardbutton = (button) findviewbyid(r.id.card_button); cardbutton.setonclicklistener(new view.onclicklistener() { @override public void onclick(view arg0) { string prehashstring = new string(); string prohashstring = new string(); string shapassphrase = new string(); shapassphrase = "gsvth£h70zkh...
Read more

Shrink a YouTube video to responsive width -

i have youtube video embedded on our website , when shrink screen tablet or phone sizes stops shrinking @ around 560px in width. standard youtube videos or there can add code make go smaller? you can make youtube videos responsive css. wrap iframe in div class of "videowrapper" , apply following styles: .videowrapper { float: none; clear: both; width: 100%; position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; } .videowrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } the .videowrapper div should inside responsive element. padding on .videowrapper necessary keep video collapsing. may have tweak numbers depending upon layout.
Read more

wpf - PdfWriter.GetInstance throws System.NullReferenceException -

i'm trying create pdf document using itextsharp 5.3.4 using following document document = new document(); filestream stm = new filestream(filename, filemode.create); pdfwriter writer = pdfwriter.getinstance(document, stm); i'm getting system.nullreferenceexception following stack trace: system.nullreferenceexception occurred hresult=-2147467261 message=la référence d'objet n'est pas définie à une instance d'un objet. source=itextsharp stacktrace: à itextsharp.text.version.getinstance() innerexception: i've verified neither document nor stm null, , if select "continue" in vs12 document created - exception thrown. updated itextsharp 5.4.0 , it's still occurring. can't find information on anywhere - got ideas? make sure not catching exceptions. nullreferenceexception can 1 caught , handled inside itextsharp, don't care it. fact can continue supports theory. change following setting verify: debug -> exceptions ...
Read more