How can I make minimum JQuery UI Tabs control? - jquery-ui

I only need a JQuery UI Tabs, so I access http://jqueryui.com/download and only select Core, Widget and Tabs 3 check boxs, then download the package jquery-ui-1.8.17.custom.zip
I find that there are many files I needn't in the package, but I don't know how can I delete these files.
And more css\ui-lightness\jquery-ui-1.8.17.custom.css inculde many content I don't need if I only use Tabs, it seems that I can delete the whole folder css\ui-lightness\images and don't cause error.

Go to http://jqueryui.com/download and select core, widget and tabs then download the package.
This is almost the minimum requirement. You only need files which in the js and css folder.
If you remove css\ui-lightness\images when you page using ui-lightness theme you will found that there is little difference between the brightness of the tab labels.
Of course. If you did not using ui-icon, you can remove ui-icons_*.png and rules ui-icon-* on jquery-ui-1.8.17.custom.css

Related

Which files to use out of the many included in JQuery mobile download

I have not been able to get an explanation of which files are needed in a JQuery Mobile Web site. The stackoverflow documentation on JQuery Mobile shows that there is one file for css and one file for js:
jquery.mobile-1.4.5.min.css
jquery.mobile-1.4.5.min.js
However, downloading the JQuery Mobile 1.4.5 package one ends up with many more. All files that have ".min" appended to the name of the asset, is a minimized version.
The standard download includes one js (the one mentioned above). That is required, as well as JQuery itself. At this date, the latest jQuery that is compatible with jQuery Mobile 1.4.5:
jquery-2.2.4.js
(correct me if that is not true)
For css files standard download includes:
jquery.mobile-1.4.5.css
jquery.mobile.structure-1.4.5.css
jquery.mobile.theme-1.4.5.css
jquery.mobile.external-png-1.4.5.css
jquery.mobile.icons-1.4.5.css
jquery.mobile.inline-png-1.4.5.css
jquery.mobile.inline-svg-1.4.5.css
It appears to me that the first file contains all the rest. So that one can choose to include all at once with one file. The others, I guess, would be used if less code is wanted in a streamlined version of JQuery Mobile. However if one does not use jquery.mobile.css, which are needed in HTML at the top of the page?
If one uses ThemeRoller, jquery.mobile.theme.css becomes MySITE.css (whatever name was selected during the export process in ThemeRoller). If one uses a custom theme, then that theme css is needed, along with jquery.mobile.structure.css.
If one includes jquery.mobile.icons.css, does that in turn include in the external-png, external-svg, and inline-png files?
And what is "jquery.mobile-1.4.5.min.map" for and when is it needed?
That would all be good information for the documentation in stackoverflow.
I created a custom theme (mysite.css) in ThemeRoller so I include the following in HTML (in the appropriate link of script tag):
mysite.css
jquery.mobile.icons-1.4.5.css
jquery.mobile.structure-1.4.5.css
jquery-2.2.4.min.js
jquery.mobile-1.4.5.js
Is that correct?

How do add Styles to JCE editor in Joomla 2.5?

I am using Joomla 2.5 with the JCE editor. I want to add my own styles but the problem is they don't appear in the Styles selection of the editor. I have the JCE configuration pointing to the editor.css, and while it does recognize the other classes in the editor.css file it doesn't recognize the ones I've added. I've cleared cache in the browser and cleared cache in Joomla, have logged out and back in, and they still don't appear.
What am I doing wrong that these Styles don't appear? Does JCE read them directly from the editor.css files each time the page loads or does it store them in some intermediary place or even in a MySQL table?
I was looking at this article:
http://www.joomlacontenteditor.net/support/tutorials/editor/item/create-a-custom-editor-stylesheet
I'm not clear on this, the class has to be present in the editor.css AND the template.css, not just the editor.css? Thanks!
JCE might cache the contents of the custom CSS file, but you should be able to see any changes you make to editor.css in your styles drop down. The file you point JCE to use for custom styles only allows you to see them in the style drop down. In order for the styles to work on the site, you have to either a) load the same file in to your template so the styles are available or b) add the styles to your template.css or other css file that is being loaded by your template.

An Alternative to JqueryUI?

I'm using jquery ui in my page for a dropdown menu. But this file has a large size (198KB) and increased my page load time.
Is there any alternative for this file? or is it possible to edit this file and remove some useless codes?
if you go to this page at jQuery UI:
http://jqueryui.com/download
you can pick what all you need to download. Also, make sure you get the minimized version.

Easy Way to Change jQuery UI Theme?

Is there an easy way to change the theme of the jQuery UI by replacing certain files? It seems like I have to keep downloading the entire jQuery UI every time I want to change the theme.
You can build your own theme at http://jqueryui.com/themeroller/.
once you build your theme you will have link both in address bar that you can bookmark and
in your css file jquery-ui-1.8.6.custom.css that you download:
http://jqueryui.com/themeroller/#ffDefault=Trebuchet+MS,+Tahoma,+Verdana,+Arial,+sans-ser...
for each modification you can use these link instead of start from beginning.
EDIT
by using totalcommander compare tool or winmerge, you just do syncronize existing jquery ui files and the new jquery ui files, if you build new one
The only thing you need to change is the stylesheet and the images.
Referring to this answer, you can find ThemeRoller edit link in your css file. This url contains whole theme settings and this is the best way how migrate/upgrade it.

jquery mobile disable ui styles formatting

I want to ba able to disable all ui classes and html formatting on every page and still be able to use transitions, load pages via ajax, etc...
I looked through the Jquery Mobile documentation and $.mobile js object but could not seem to find anything.
If anyone knows would be really helpful :)
Download builder: In the works
Now that we’ve decoupled most of the UI widgets, we’ve set the stage
for there to be a download builder. This will let you build a custom
version of jQuery Mobile to only include the parts you need. For
example, you could just use the core files to add Ajax-based
navigation with pushState and leverage some of the touch events and
other utilities with a very lightweight build (roughly 11k). Or, you
could add in specific UI widgets like form elements, listviews, etc.
to create an optimized build. We’re aiming to have a download builder
tool as part of 1.0.
Source:
http://jquerymobile.com/blog/2011/09/08/jquery-mobile-beta-3-released/

Resources