jor_carouselMeetsJssor 3.1__**UPDATE**__3.2

In this section you can share self-made extensions with other users of WYSIWYG Web Builder.
There is a dedicated section for commercial extensions.
Post Reply
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

jor_carouselMeetsJssor 3.1__**UPDATE**__3.2

Post by jordan »

jor_carouselMeetsJssor 3.2

=======================================================================================

Image

=======================================================================================

jor_carouselMeetsJssor uses the WB Carousel component as a container for the Jssor Slider

jor_carouselMeetsJssor offers the following Jssor functions ...

- Slideshow with 151 transitions - (+ create unlimited variations with custom properties - row/column/zoom/rotate/duration - if appl.)
- Arrow Navigation - position and style by WB Carousel
- Pager Navigation - 17 skins - position by WB Carousel - (+ option lanes)
- Thumbnail Navigation - position left/right/top/bottom
- Caption transition with 161 transitions - animate any object inside the WB Carousel in and out - (+in/out) of position
--- (+ create unlimited variations with (advanced) custom properties - x/y/rotate/zoom/opacity - in/out)

jor_carouselMeetsJssor also offers the following exclusive options ...

- WB Carousel as container - (content, arrow and pager positioning)
- Stop/Play autoplay button by WB Image or WB Text object
- Slide Counter by WB Text object
- Visual timer or percentage display by WB jQuery Progressbar or WB Text object - (+ single style the jQuery Progressbar)
- Caption transition - target object by ID or CLASS
- Pager 1 skin - freely style with border-width/style/color, background-color (def/hov/act) + enable numbers etc
- Thumbnails - freely style with border-width/style/color (def/hov/act) + opacity + custom pointer etc
- Auto Switch - only engage autoplay if the slider is in view - (vertical axis)
- "RWD-pseudo-solutions" - backdrop mode by WB Layer (=neutralize occupied space on scale) + option chase background etc
- Many other ie.
--- correct auto centering thumbnails, pagers and arrow navigation - (scaled/non-scaled)
--- correct auto centering thumbnail pointer
--- most pager skins soft re-designed
--- multiple instances per page
--- etc

jor_carouselMeetsJssor is a super cool extension that brings many functions of the amazing Jssor slider to Webbuilder !

=======================================================================================

AND OF COURSE - OH MAMA - :cool: - IT'S-STILL-FREE!

=======================================================================================

=======================================================================================

DEMO jor_carouselMeetsJssor: visit jorextensions.com
DOWNLOAD: jor_carouselMeetsJssor
-------- see the - jor_carouselMeetsJssor_easystart.wbs - project in the download for many examples!

Builder: jordan (6j6)
Code: jordan (6j6)
EB version: 5.3.2
WB version: 10+
jQuery lib: 1.7.2+
W3C valid: Html, Xhtml
Original Code: jssor.com
License: released under the MIT and GPL licenses

HISTORY:
-#-#-#- version 2: -#-#-#- 14/feb/16
01. new: WB11 - support carousel float mode
02. new: WB11 - support carousel background image can set Jssor slideshow image
03. fix: WB11 - support altered bookmark - (=property mark trace)
04. additional: WB11 - added WB11 easystart project

-#-#-#- version 3: -#-#-#- 17/jul/16
01. fix: slideshow - option hide vs carousel background image fix
02. fix/enhanced: window alert - WB11 responsive mode
03. advanced: advanced: allow Jssor Methods/Events
04. enh: compiled with EB 5.3.2
05. additional: updated WB11 easystart project - (=responsive note)

-#-#-#- version 3.1: -#-#-#- 08/jan/17
01. fix/enhanced: backdrop - adjust top position - dynamic on click - (float/grid)

-#-#-#- version 3.2: -#-#-#- 06/jun/17
01. fix/enhanced: window alert - WB12 fullpage mode
02. new: new option: pager 1 - border-radius
03. new: new option: slider counter - display total count
03. new-blocks: WB12 BLOCKS (x4) - basic + basic external + float + float external

- for full update history see .pdf in download
Last edited by jordan on Wed May 31, 2017 1:54 pm, edited 9 times in total.
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor___**NEW**___**SOON**

Post by jordan »

jor_carouselMeetsJssor SOON!

Whoaa another one done ... uuhh almost done . :mrgreen: ... jor_carouselMeetsJssor
jor_carouselMeetsJssor uses the WB Carousel component as a container for the Jssor Slider

see a preview in the new cool demo on jorextensions.com !
User avatar
BaconFries
 
 
Posts: 5316
Joined: Thu Aug 16, 2007 7:32 pm

Re: jor_carouselMeetsJssor___**NEW**___**SOON**

Post by BaconFries »

Looking "GREAT" jordan may I add as always.. :D keep up your "GREAT" contribution to the forum.
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor___**NEW**___**SOON**

Post by jordan »

Heya how-i is batman:) - always great to hear from you, thanks for your words Calum - TNX! . :) .

ps:
hope 2015 was well for you, and in short advance, hope 2016 will be a SUPER year for you and you loved ones!:)
User avatar
tommy888
 
 
Posts: 214
Joined: Mon Sep 28, 2009 5:41 pm
Location: Poland
Contact:

Re: jor_carouselMeetsJssor___**NEW**___**SOON**

Post by tommy888 »

Supurb Extention Jor!
Great Work :) Thanks.
Looking' forward to the first download available.

Seasonal Greatings from Poland!
Merry Christmas and Happy New Year to You, Your Family and Friends.
All the best,
Tomasz
User avatar
BaconFries
 
 
Posts: 5316
Joined: Thu Aug 16, 2007 7:32 pm

Re: jor_carouselMeetsJssor___**NEW**___**SOON**

Post by BaconFries »

@jordan well still alive and kicking :D Wishing I was still able to get extensions made bu dont have that will or the patience anymore that I use to have. Right you carry on doing what your "Great" at and have fantastic Christmas.
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor___**NEW**___**SOON**

Post by jordan »

tommy888 wrote:Supurb Extention Jor!
Great Work :) Thanks.
Looking' forward to the first download available.

Seasonal Greatings from Poland!
Merry Christmas and Happy New Year to You, Your Family and Friends.
All the best,
Tomasz
great you like tommy888:), working as hard as I can to finish it, still got some work to do tho

also the best of days and a healthy 2016 to you and you hold dear! . :D .
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor___**NEW**___**SOON**

Post by jordan »

BaconFries wrote:still alive and kicking :D
that's all I wanna hear Calum . :cool: . gu-goOd!
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor___**RELEASED**

Post by jordan »

jor_carouselMeetsJssor 1.0 RELEASED

nice one to play with:) - enjoy!


======
A BEST OF 2016 WISHES TO PABLO AND FAMILY AND ALL THE WB COMMUNITY! . :) .
User avatar
BaconFries
 
 
Posts: 5316
Joined: Thu Aug 16, 2007 7:32 pm

Re: jor_carouselMeetsJssor___**RELEASED**

Post by BaconFries »

Thx for the release jordan. I will be downloading when back at PC and I am sure it will be 'Great' as always
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor___**RELEASED**

Post by jordan »

BaconFries wrote:Thx for the release jordan. I will be downloading when back at PC and I am sure it will be 'Great' as always
. 8) :) .
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor___**RELEASED**

Post by jordan »

hello pollillo5

I can't see what you have done, so I don't know ?
have you read the jor_CMJ pdf manual in the download - (First Setup - Slideshow) ?
have you tried the jor_CMJ easystart project in the download, does jor_CMJ work there ?

===========
WB11 NOTE!
if your using WB11 note that I have an update release very soon, it fixes/adds some WB11 compatibility
- (ie. - add jor_CMJ Slideshow image by WB11 Carousel background image)
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor 1.0__**UPDATE**__2.0

Post by jordan »

jor_carouselMeetsJssor 2.0 - UPDATE

jor_carouselMeetsJssor 2.0 fixes/adds compatibility with WB11

01. new: WB11 - support carousel float mode
02. new: WB11 - support carousel background image can set Jssor slideshow image
03. fix: WB11 - support altered bookmark - (=property mark trace)
04. addit: WB11 - added WB11 easystart project

for full update history, demo and download see top post
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor 2.0__**UPDATE**___3.0

Post by jordan »

jor_carouselMeetsJssor 3.0 - UPDATE

jor_carouselMeetsJssor 3.0 fixes and adds some functions

01. fix: slideshow - option hide vs carousel background image fix
02. fix/enh: window alert - WB11 responsive mode
03. adv: advanced: allow Jssor Methods/Events
04. enh: compiled with EB 5.3.2
05. addit: updated WB11 easystart project - (=responsive note)

for full update history, demo and download see top post
User avatar
BaconFries
 
 
Posts: 5316
Joined: Thu Aug 16, 2007 7:32 pm

Re: jor_carouselMeetsJssor 2.0__**UPDATE**___3.0

Post by BaconFries »

Nice update Jordan. :D
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor 2.0__**UPDATE**___3.0

Post by jordan »

BaconFries wrote:Nice update Jordan. :D
. :) .
mariojazz
 
 
Posts: 14
Joined: Tue Jun 28, 2011 2:33 pm

Re: jor_carouselMeetsJssor 2.0__**UPDATE**___3.0

Post by mariojazz »

Hi.
First time I try your extension,and just I do not think I even wonder extension.

Thanks Jordan

http://giphy.com/gifs/HJ8NsNtn9VswE/html5
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor 2.0__**UPDATE**___3.0

Post by jordan »

mariojazz wrote:Hi.
First time I try your extension,and just I do not think I even wonder extension.

Thanks Jordan

http://giphy.com/gifs/HJ8NsNtn9VswE/html5
Argh ye scurvy pirate:) - glad you like mariojazz
mindentezzel
 
 
Posts: 72
Joined: Sun Feb 09, 2014 12:58 pm

Can I give sound or noise effect to jor_carouselMeetsJssor

Post by mindentezzel »

Dear Jordan,

many thanks for your great extensions. I love them.

Is there a way to add sound effect to the carousel? I think, there must be many ways, but I cannot write programs in html, Java etc.


I'd like to add sound when a picture comes in and when it goes out. How is it possible?
Please be very "user-friendly" , since I am not a guru 8)


Thanks,
T.
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: Can I give sound or noise effect to jor_carouselMeetsJ

Post by jordan »

mindentezzel wrote:Is there a way to add sound effect to the carousel? I think, there must be many ways, but I cannot write programs in html, Java etc.
hi mindentezzel,

great to hear you like my extensions:)

nope, sound effects is not part of the jssor slider, it takes custom code to achieve that
I can not help with custom coding, sorry:(
I can give you a head start on how to, but you have to take it from there to your own requirements
quick example - see here
I do not know if this holds up cross-browser (doubt it) ? - test for yourself

user friendly advise:)
personally I would recommend not to use sound and animation at the same time
especially if your not familiar with interactive media control, javascript, etc

but if this is what you want, then I can give you a quick how to ...
mindentezzel
 
 
Posts: 72
Joined: Sun Feb 09, 2014 12:58 pm

Re: jor_carouselMeetsJssor 3.0

Post by mindentezzel »

Dear Jordan,
thank you for the fast example. It's great! What else! :)

Can you please post the wbs file just to see how it works. If I see one solution, I am able to use and/or modify this.
I do understand, if you wouldn't like to publish it for everyone, since it is not as perfect as your other great extensions. Knowing this, may I give you my email address, would you send the wbs to me?
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor 3.0

Post by jordan »

hi mindentezzel,

I think it's better to do it step by step to understand ... (mind the color notes)

STEP 1:
- add a WB carousel
- add jor_carouselMeetsJssor
- (or open jor_carouselMeetsJssor_easystart in the download, use any of the examples (IMPORTANT: match id in code))

STEP 2:
- add a HTML5 audio player to your project - add an audio clip
- set in the audio player - Autoplay to off
- set in the audio player - Show controls to off

STEP 3:
between page <HEAD> add the following ...

=============================================================================
<script>
$(function() {
//--- IMPORTANT: jor_cmj_pc1 = match carousel id --- see jor_carouselMeetsJssor pdf (methods and event)
jorcmj_pc1 = function(slideIndex,progress,progressBegin,idleBegin,idleEnd,progressEnd) {

var slideSt = progress<40;

// --- REPEAT THIS FOR EACH SLIDE/CLIP - copy/paste - (change index + media player)
if (slideIndex==1) {
if (slideSt) {
$('#MediaPlayer1')[0].play();
};
}
else if (slideSt) {
$('#MediaPlayer1')[0].pause();
$('#MediaPlayer1')[0].currentTime=0;
};
// --- REPEAT THIS FOR EACH SLIDE/CLIP - copy/paste - (change index + media player)


};
});
</script>
=============================================================================

STEP 4:
- repeat step 2 for each media clip required
- repeat "REPEAT" code for each slide/clip (copy/paste)


that should do, hope this helps!
mindentezzel
 
 
Posts: 72
Joined: Sun Feb 09, 2014 12:58 pm

Re: jor_carouselMeetsJssor 3.0

Post by mindentezzel »

Thank you very much for your help and valuable time you spent writing this lesson :)

Works excellent!
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor 3.0__**UPDATE**__3.1

Post by jordan »

jor_carouselMeetsJssor 3.1 - UPDATE

01. fix/enhanced: backdrop - adjust top position - dynamic on click - (float/grid)

for full update history, demo and download see top post
jordan
 
 
Posts: 831
Joined: Tue Jun 26, 2007 1:56 pm
Contact:

Re: jor_carouselMeetsJssor 3.1__**UPDATE**__3.2

Post by jordan »

jor_carouselMeetsJssor 3.2 - UPDATE

01. fix/enhanced: window alert - WB12 fullpage mode
02. new: new option: pager 1 - border-radius
03. new: new option: slider counter - display total count
03. new-blocks: WB12 BLOCKS (x4) - basic + basic external + float + float external

for full update history, demo and download see top post
Post Reply