javascript - Build embeddable HTML page -

-

i'm new html5

i'm trying make basic paint/whiteboard webpage embeddable other website.

the whiteboard consist of 3 files: index.html, app.js , style.css

what i'm asking how make more widget embeddable where?

i have did many searches , confused, between building jquery widget http://alexmarandon.com/articles/web_widget_jquery/#loading-javascript-libraries

or don't have there many separate files?

any recommendation , guidance highly appreciated thanks

i think answer here depends on target audience.

@lucasnadalutti correct iframe may universally accepted way embed entire html page, if page needs interact host site's other elements, data, or server in way, you'll want pursue approach.

since you're creating widget meant embedded in other people's websites, target audience other developers, since ones might choose use widget on sites build.

assuming developers target audience widget, create wordpress plugin, jquery plugin, or number of other framework-specific plugins make easy developers use code.

the choice yours framework create for, , decision based on place think demand type of widget highest...

but if you're stating out, i'd recommend creating jquery plugin public github repo well-written readme explain how use widget.

here's example: https://github.com/carhartl/jquery-cookie

edit
per comment, here resources , examples more specific needs:

here'a resource how build jquery plugin:
https://learn.jquery.com/plugins/basic-plugin-creation/

owl carousel example of jquery plugin requires html, css, , js files. see link example of how implement plugin:
http://owlgraphic.com/owlcarousel/#demo

page setup + css:

<!-- important owl stylesheet --> <link rel="stylesheet" href="owl-carousel/owl.carousel.css">  <!-- default theme --> <link rel="stylesheet" href="owl-carousel/owl.theme.css">  <!--  jquery 1.7+  --> <script src="jquery-1.9.1.min.js"></script>  <!-- include js plugin --> <script src="assets/owl-carousel/owl.carousel.js"></script>

html:

<div id="owl-example" class="owl-carousel">   <div> content </div>   <div> content </div>   <div> content </div>   <div> content </div>   <div> content </div>   <div> content </div>   <div> content </div>   ... </div>

js:

 $(document).ready(function() {     $("#owl-example").owlcarousel();   });

Comments

Post a Comment

Popular posts from this blog

python - TypeError: start must be a integer -

-
i trying draw 5 turtles, getting typeerror on line 25. here code: import turtle wn = turtle.screen() redrose = turtle.turtle() color = input("what background color be?") fillcolor_f = input("what color of rose be?") redrose.hideturtle() redrose.speed(30) redrose.penup() redrose.left(180) redrose.forward(175) redrose.right(90) redrose.forward(30) redrose.right(90) redrose.pendown() def drawrose(red): redrose.color("pink") redrose.fillcolor(fillcolor_f) redrose.fill(true) in range(red): redrose.forward(i) redrose.right(49) in range(5): drawrose(redrose) redrose.penup() redrose.forward(350) redrose.right(144) redrose.pendown() redrose.fill(false) drawrose(50) wn.bgcolor(color) i trying draw 5 roses, produces errors. doing in interactivepython.org. you recursively calling drawrose wrong parameter. on line 23 ( for in range(red): ) expect red integer...
Read more

c# - DevExpress RepositoryItemComboBox BackColor property ignored -

-
i have following code almost works properly; private void cbstatus_drawitem(object sender, listboxdrawitemeventargs e) { string item = e.item string; if (item != null) { switch (item) { case "1": e.appearance.forecolor = color.green; e.appearance.backcolor = color.green; break; case "2": e.appearance.forecolor = color.orange; e.appearance.backcolor = color.orange; break; case "3": e.appearance.forecolor = color.red; e.appearance.backcolor = color.red; break; } } } when dropdown shown, items forecolor correct, backcolor remains whatever backcolor of theme is; i.e. if i've got set dark theme, backcolor dark, cells in gridview, rather being green/orange/red. i've tried setting e.appearance.options.usebackcolor trying set e....
Read more

django - Creating multiple model instances in DRF3 -

-
1) create multiple model instances 1 api call, asked here: how create multiple model instances django rest framework? tried solution named in link, no success. i trying upload multiple files in 1 api call. result: files uploaded (only once overwrote perform_create) 1 instance created (if send 2 files, latter created instance). my code: class fileuploadserializer(serializers.modelserializer): def __init__(self, *args, **kwargs): many = kwargs.pop('many', true) super(fileuploadserializer, self).__init__(many=many, *args, **kwargs) class meta: model = fileupload read_only_fields = ('created', 'datafile', 'owner') class fileuploadviewset(viewsets.modelviewset): queryset = fileupload.objects.all() serializer_class = fileuploadserializer parser_classes = (multipartparser, formparser, ) def perform_create(self, serializer): file_list = self.request.data.getlist('file') ...
Read more