CTC Overlay jQuery
jQuery plugin to add overlay image viewer to your image gallery and content viewer to you you want to load on modal window. jQuery plugin version of overlay functionalities built-in in CT Commerec WordPress Plugin
USAGE
Plugin lets you display all of the images inside the element , you can apply it to one or multiple galleries
- Including CTC Overlay jQuery
- Below are some of the most common ways to include ctc-overlay-jquery
- 1.Script tag
- Download files
- 1.ctc_overlay.jquery.js,
- 2.ctc_overlay_style.css
- Include files
- 1. include jQuery :- https://code.jquery.com/jquery-3.3.1.min.js,
- 2.includeCTC Overlay(file) :- ctc_overlay.jquery.js,
- 3. include CTC Overlay stylesheet(file) :- ctc_overlay_style.css
- Note: Apply ctcOverlay to as many gallery as you like (includes all images inside element)
- Overlay image viewer
- $('.image_gallery,.image_gallery_2,.image_gallery_3').ctcOverlay();
- Overlay content viewer use $.ctcOverlayEl({parameter1}{parameter2})
- A.Parameter 1
- *elemHeight: '300px'in px':-
- do not use % or auto - optional
- *elemWidth:'300px'in px':-
- do not use % or auto - optional
- *ajaxUrl:'some_url'url:-
- to get response from' - required for AJAX request
- *ajaxData:'some_data':-
- data to send to server' - jQuery AJAX request format
- *ajaxMethod:'some_data':-
- method you wish to use use for AJAX request default GET
- *elemSelector:'element_selector':-
- jQuery element selector if getting content of element not making AJAX request
- *modalMessage:'some message':-
- string you wish to load on modal window with OK button
- *iframeUrl:'url_to_iframe' :-
- url you wish to iframe inside modal window
- *hideCloseBtn:'no' :-
- if set 'NO' user won't have option to close overlay, 'YES' if left empty
- B.Parameter 2.javascrip object - optional (use only if you want to do more with AJAX)
- *Works eactly like $.ajax() function :-http://api.jquery.com/jquery.ajax/ (can leave first parameter as empty var or object )
- Content loading priority
- a.{parameter2}
- gets first priority over first width content loading parameter 1 can be use for setting dimesnion and hideCloseBtn
- b.{parameter1}
- content fetched from ajaxUrl
- c.{parameter1}
- content set for modalMessage
- d.{parameter1}
- content from iframeUrl
- e.{parameter1}
- content of element set for elemSelector
- Note:precending must not be there for suceeding to work
#####
######
- 2.Node
- To include CTC overlay in Node, first install with npm
- npm install ctc-overlay-jquery
- And you know the rest...
- MIT