hello everyone !!
i would like some help to embed a JS library to SB
how can i use this > https://flickity.metafizzy.co/#initialize-with-jquery on sb ?
how can i embed flickit with sb ?
-
- Posts: 120
- Joined: Tue Jun 14, 2016 7:17 pm
Re: how can i embed flickit with sb ?
i am trying append this html code :
(source > https://bxslider.com/install/)
using this way in spiderbasic :
but dont works ... someone know a working way ?
(source > https://bxslider.com/install/)
Code: Select all
<html>
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.min.js"></script>
<script>
$(document).ready(function(){
$('.slider').bxSlider();
});
</script>
</head>
<body>
<div class="slider">
<div>I am a slide.</div>
<div>I am another slide.</div>
</div>
</body>
</html>
Code: Select all
Procedure.i WindowElement(Window, UseJquery.b=#True)
Protected winObject=WindowID(Window)
!return (v_winobject && v_winobject.element)? v_usejquery? $(v_winobject.element):v_winobject.element:null;
EndProcedure
Procedure dominsert(window.i, value.s)
Protected windowObject=WindowElement(window)
! var selector = v_windowobject.find('.spiderwindow-content')
! selector.append(v_value)
EndProcedure
Procedure Main(URL$, Success)
Debug "Script URL: " + URL$
Debug "Loading status: " + Success
OpenWindow(0, 0, 0, 360, 80, "Led Display", #PB_Window_ScreenCentered)
str.s = "<div class='slider'>"+#CRLF$
str = str + "<div>I am a slide.</div>"+#CRLF$
str = str + "<div>I am another slide.</div>"+#CRLF$
str = str + "</div>"+#CRLF$
dominsert(0, str)
!$(document).ready(function(){
! $('.slider').bxSlider();
!});
EndProcedure
Procedure loadjs(URL$, Success)
LoadScript("https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.min.js", @Main())
EndProcedure
LoadScript("https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.css", @Main(), #PB_Script_CSS)
Re: how can i embed flickit with sb ?
Hello skinkairewalker,
You got a typo in your code. You do not call the procedure loadjs(). Here is the code as I would write it:
Greetings ... Peter
You got a typo in your code. You do not call the procedure loadjs(). Here is the code as I would write it:
Code: Select all
EnableExplicit
Enumeration
#Window
#Container
EndEnumeration
Procedure Main()
Protected HTML.s
Protected GID
OpenWindow(#Window, 0, 0, 360, 200, "Led Display", #PB_Window_ScreenCentered)
ContainerGadget(#Container, 0, 0, WindowWidth(#Window), WindowHeight(#Window)) : CloseGadgetList()
HTML = "<div class='slider'>" + #CRLF$ +
" <div style='height:150px'>I am a slide.</div>" + #CRLF$ +
" <div style='height:150px'>I am another slide.</div>" + #CRLF$ +
"</div>" + #CRLF$
GID = GadgetID(#Container)
! $(v_gid.div).append(v_html);
! $(document).ready(function(){
! $('.slider').bxSlider();
! });
EndProcedure
Procedure JsLoaded(URL.s, Success)
If Success
Main()
Else
Debug "Something has gone wrong. Couldn't load '" + URL + "'"
EndIf
EndProcedure
Procedure CssLoaded(URL.s, Success)
If Success
LoadScript("https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.min.js", @JsLoaded(), #PB_Script_JavaScript)
Else
Debug "Something has gone wrong. Couldn't load '" + URL + "'"
EndIf
EndProcedure
LoadScript("https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.css", @CssLoaded(), #PB_Script_CSS)
-
- Posts: 120
- Joined: Tue Jun 14, 2016 7:17 pm
Re: how can i embed flickit with sb ?
thanks !! this works fine ..
-
- Posts: 120
- Joined: Tue Jun 14, 2016 7:17 pm
Re: how can i embed flickit with sb ?
i am trying add another carousel called https://kenwheeler.github.io/slick/ , but when i call function show this error >https://prnt.sc/rc7jq3
this is a SB code >
do you know how can i fix it ?
this is a SB code >
Code: Select all
EnableExplicit
ExamineDesktops()
Global deskwidth.i = DesktopWidth(0)
Global deskheight.i = DesktopHeight(0)
Enumeration
#Window
#Container
EndEnumeration
Procedure Main()
Protected HTML.s
Protected GID
OpenWindow(#Window, 0, 0, deskwidth, 600, "Led Display", #PB_Window_ScreenCentered)
ContainerGadget(#Container, 0, 0, WindowWidth(#Window), WindowHeight(#Window)) : CloseGadgetList()
HTML = "<div class='slider'>" + #CRLF$ +
" <div>your content</div>" + #CRLF$ +
" <div>your content</div>" + #CRLF$ +
" <div>your content</div>" + #CRLF$ +
"</div>" + #CRLF$
GID = GadgetID(#Container)
! $(v_gid.div).append(v_html);
!$(document).ready(function(){
! $('.slider').slick();
! });
EndProcedure
Procedure JsLoaded(URL.s, Success)
If Success
Main()
Else
Debug "Something has gone wrong. Couldn't load js'" + URL + "'"
EndIf
EndProcedure
Procedure CssLoaded3(URL.s, Success)
If Success
LoadScript("https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.7.1/slick.min.js", @JsLoaded(), #PB_Script_JavaScript)
Else
Debug "Something has gone wrong. Couldn't load 2'" + URL + "'"
EndIf
EndProcedure
Procedure CssLoaded2(URL.s, Success)
If Success
LoadScript("https://code.jquery.com/jquery-migrate-1.4.1.min.js", @CssLoaded3(), #PB_Script_JavaScript)
Else
Debug "Something has gone wrong. Couldn't load 2'" + URL + "'"
EndIf
EndProcedure
Procedure CssLoaded1(URL.s, Success)
If Success
LoadScript("https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.7.1/slick-theme.css", @CssLoaded2(), #PB_Script_CSS)
Else
Debug "Something has gone wrong. Couldn't load 1'" + URL + "'"
EndIf
EndProcedure
LoadScript("https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.7.1/slick.css", @CssLoaded1(), #PB_Script_CSS)
Re: how can i embed flickit with sb ?
Code: Select all
EnableExplicit
ExamineDesktops()
Global deskwidth.i = DesktopWidth(0)
Global deskheight.i = DesktopHeight(0)
Enumeration
#Window
#Container
EndEnumeration
Procedure Main()
Protected HTML.s
Protected GID
OpenWindow(#Window, 0, 0, deskwidth, 600, "Led Display", #PB_Window_ScreenCentered)
ContainerGadget(#Container, 0, 0, WindowWidth(#Window), WindowHeight(#Window)) : CloseGadgetList()
HTML = "<div class='slider'>" + #CRLF$ +
" <div>your content1</div>" + #CRLF$ +
" <div>your content2</div>" + #CRLF$ +
" <div>your content3</div>" + #CRLF$ +
"</div>" + #CRLF$
GID = GadgetID(#Container)
! $(v_gid.div).append(v_html);
!$(document).ready(function(){
! $('.slider').slick();
! });
EndProcedure
Procedure CssLoaded(URL.s, Success)
If Success
! require(["https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js"], function() {
Main()
! });
Else
Debug "Something has gone wrong. Couldn't load '" + URL + "'"
EndIf
EndProcedure
LoadScript("https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css", @CssLoaded(), #PB_Script_CSS)
-
- Posts: 120
- Joined: Tue Jun 14, 2016 7:17 pm
Re: how can i embed flickit with sb ?
thanks you very much PeterPeter wrote:Code: Select all
EnableExplicit ExamineDesktops() Global deskwidth.i = DesktopWidth(0) Global deskheight.i = DesktopHeight(0) Enumeration #Window #Container EndEnumeration Procedure Main() Protected HTML.s Protected GID OpenWindow(#Window, 0, 0, deskwidth, 600, "Led Display", #PB_Window_ScreenCentered) ContainerGadget(#Container, 0, 0, WindowWidth(#Window), WindowHeight(#Window)) : CloseGadgetList() HTML = "<div class='slider'>" + #CRLF$ + " <div>your content1</div>" + #CRLF$ + " <div>your content2</div>" + #CRLF$ + " <div>your content3</div>" + #CRLF$ + "</div>" + #CRLF$ GID = GadgetID(#Container) ! $(v_gid.div).append(v_html); !$(document).ready(function(){ ! $('.slider').slick(); ! }); EndProcedure Procedure CssLoaded(URL.s, Success) If Success ! require(["https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js"], function() { Main() ! }); Else Debug "Something has gone wrong. Couldn't load '" + URL + "'" EndIf EndProcedure LoadScript("https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css", @CssLoaded(), #PB_Script_CSS)