Responsiveness with Jquery Ui and Bootstrap - javascript

I have my Website build with JqueryUI widgets. Now I need to make Website responsive and I was recommended by a friend to use bootstrap for this ,but i read somewhere that using both JqueryUI and Bootstrap together cause some problems or conflicts,so my question is:-
Is any conflict occur ,if yes,then what kind of conflicts can occur.
Is there any way to avoid conflicts.
Any other way I can make my website responsive.

As per the comment suggest by me above i believe following link can be the answer Conflicts between JQueryUI and bootstrap
Hope this helps...

Related

Change main content on a webpage using bootstrap

I am building a webpage using Bootstrap 3. I am trying to find the best way to change the main content of the side. I have a Header, left content and right content but I want to change the middle content by pushing a button without changing the surrounding elements. What would be the best thing to use to accomplish this. Is there some demos online that someone can point out? I have been trying to find some but without luck.
Bootstrap doesn't have that feature. First try to learn what bootstrap can do or can't, what bootstrap made for.
What you are trying to do is called templating. You can use php, ajax or other methods to dynamically add content to your content section of your template.
You have many ways to do that, maybe with jQuery .load() and maybe combined with HTML5 history API or some other framework...
But Bootstrap has nothing to do with that..
You can start reading about AJAX and DOM manipulation first, but here is some link you can use:
Dynamically Loading Content in Twitter Bootstrap Tabs
You cannot do that with boot strap that is just not what it's made for you can use either PHP or Ajax personally if you know PHP already and have everything set up for go with that because in my opinion Ajax sucks to learn and work with

jquery modal / dialog

I want to use some jquery plugin to show modal. I have been using fancybox but it has problem that second fancybox can not be shown on one. I have used jquery UI but it has images and I want some plugin which is not dependent on images. Here are my requirements:
to show on page load
to show on ajax success
customizable with custom css
second modal/dialog can be shown on first one.
Please suggest.
I like http://jqueryui.com/dialog/ I know you said that you used it but did not like it as it has images, but I would override your images with custom css - which is not to difficult. simnple model is fine but I find ui better
Your question is not in the Q&A format of Stackoverflow, because you are essentially soliciting opinions (i.e., no definitive answer).
Nevertheless, SimpleModal is an excellent light-weight jQuery plugin I've used for modal dialog boxes.
Have a look on this one, I used it in the past: http://www.paulund.co.uk/how-to-create-a-simple-modal-box-with-jquery

Strange JS function issue

I'm developing website. Using 2 libraries at same page: jQuery UI and Twitter Bootstrap.
I single-stepped through combobox code, and when it called .button() it went into bootstrap.min.js, not jqui.js. The question is, how to resolve the conflict between these two libraries?
BTW, Here is jsFiddle where it works well without bootstrap
If button is the only conflict then you may save $.fn.bootstrap_button = $.fn.button after loading bootstrap, and then load jqueryui. Or you may configure and download bootstrap without button widget.

Is there a basic/simple lightbox/overlay jQuery-based library anywhere?

Is there any Lightbox-live or overlay library out there that only provides the "basic cross-browser centered popup with a dark background" without attempting to perform requests and display images?
I would like to populate the contents myself using my own JS code which is non-trivial and all of these libraries expecting a link with something displayable inside it are unusable for my simple yet unusual (it would appear) use case...
I've gone over maybe 15 Lightbox clones today and for the life of me couldn't find a simple way to just get the basic overlay functionality without the added fluff. Is anyone familiar with something like that ?
Look into Colorbox. Check the Inline Examples. It works well.
http://jacklmoore.com/colorbox/
Look here: http://jacklmoore.com/colorbox/example1/ under "Other Content types"
Try jQuery UI dialog!
jQuery Dialog in jQuery UI might be an option to consider.
You can customize the download of the library to give you only the dialog.
Just de-select everything from here and select "Dialog" only (it will select the minimum dependencies for you):
http://jqueryui.com/download

jQuery Tools (horizontal accordion) combined with jQuery UI (tabs)?

Hello everybody and thanks for taking your time.
I got an existing project where the main-page uses a horizontal accordion for the main content area from jQuery Tools (the Tabs element).
Now i have to implement a Tabs-menu (into one of the existing accordion pages) which is build with jQuery UI (the main container are Tabs and inside of them are several nested accordions).
Is there any easy way I can solve this problem and combine jQuery Tools with jQuery UI?
I did a search-replace on the tabs code of jQuery UI (js+css) and changed everything from "tabs" to "tabsnew"..
The script seems to work with this, but the css is not working correctly with this (even tough I changed all elements which are used to build up the Tabs).. I think there must be an easier solution for this..
I'm very thankful for any ideas or solutions!
Drop jQuery UI and implement the tabs again in jQuery Tools. If this is production code for a website there's no reason the users should load both libraries.

Categories

Resources