I have implemented datepicker following "jQuery getting started", using 3 files:
<link type="text/css" href="css/themename/jquery-ui-1.8.22.custom.css" rel="Stylesheet" />
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.22.custom.min.js"></script>
It suggests to use 3 files including "jquery-1.4.4.min.js". What if I want to use full .js file e.g "jquery.ui.datepicker.js" for datepicker. Reason of asking to use full version is to modify some elements for my need which is difficult in minified version.
Then download and reference the unminified version.
There is no difference aside from the size of the files. You can always re-minify once you've completed your changes.
If you're doing a custom build, the non minified version of jquery.ui.datepicker will be in in the development-bundle/ui folder.
Related
Is there a way to include a css/js file in the umbraco backoffice which I need to use in the whole site(not in a single plugin)?
Thanks
The Umbraco backoffice main View is usually located in your project folder under:
$YourSolutionFolder\ProjectFolder\umbraco\Views\Default.cshtml
In that file you can insert a link to your external CSS or JS as follows:
<link rel="stylesheet" type="text/css" href="~/css/theme.css">
<script src="~/scripts/script.js"></script>
Note: Bear in mind that you can have some CSS conflicts overriding some Umbraco styles when using your own custom CSS file.
When rendering the styles from bundles when optimization is on you get this:
<link href="/Content/themes/base/css?v=UM624qf1uFt8dYtiIV9PCmYhsyeewBIwY4Ob0i8OdW81" rel="stylesheet" type="text/css" />
Unfortunately the Android browser do not seem to load urls with query strings on them. Is there some way you can customize this string in System.Web.Optimization?
Edit:
My question is answered and I tried to detect android on user agent string and replace with a querystring less link to the stylesheet. Apparently the problem I had wasn't because of the querystring, it was minified version of the webfont css that was causing it not to load the stylesheet completely in the Android stock browser.
Android stock browser fails to load css content string with escaped backslash which was a workaround for the ASP.NET minifier that erronously minifies the same css content string. I ended up putting the icon font css styles on it's own "minified by hand" stylesheet.
You can disable caching by using
#{string path = BundleTable.Bundles.ResolveBundleUrl("~/bundle/cssCommon", false);}
//may apply manual path transformation to remove ?v= anyway
<link href=#path rel="stylesheet" type="text/css" />
or short form
<link href="#BundleTable.Bundles.ResolveBundleUrl("~/bundle/cssCustom", false)"
But you will have caching-related problems instead of android WebView problems.
Another possible approach is using Microsoft Ajax Minifier
We don't currently support customizing how the version string appears in the url unfortunately.
This is a link to the issue on our codeplex site: Url version issue
In the meantime, if you are willing to live with manually rev'ing the bundle path every time you change the bundle, you could just avoid using the helpers and just having explicit links to your bundles which you update each time your bundle changes:
<link href="/Content/themes/base/css" rel="stylesheet">
Or you could disable caching on the client via bundle.Cacheability = HttpCacheability.NoCache
Has anyone used the FullCalendar-mobile plugin? I am trying to use this in a jQuery Mobile app bundled with Phonegap. There are tons of js and css files in the src folder but I can't seem to figure out which one to use. Linking all of them to my html page didn't yield any results.
Pardon the very noob question. Kinda new to jQuery, HTML5 & CSS. Would greatly appreciate the help.
Thanks!
I'm just going through this myself. My understanding is that you'll need to do the following:
Download the files from
https://github.com/JordanReiter/fullcalendar-mobile using either git
or the 'download as zip' button.
Navigate to your downloaded directory
Type make zip, as per the instruction from the link above. (You'll need java installed apparently)
In the dist directory created by the above process you should see the fullcalendar directory containing the js and css files you need.
Copy those to your project and link appropriately. You are now officially good to go
I have the same problem with the css files. Until now I'm not able to combine the style sheets delivered with jquery and jquery mobile for the desired result:
http://thomkerle.blogspot.ch/2012/07/problems-with-jquerys-fullcalendar-and.html
Note:
for basic usage you can just take the latest fullcalendar version! There will be some events that are not supported (but basically you can press on a event and navigate through the calendar).
See also:
http://forum.primefaces.org/viewtopic.php?f=8&t=23763
Looks like you want to use the _loader.js file
just keep the structure of the directories that exists
I am working on this right now ill post updates as a reference. The documentation states:
<link rel='stylesheet' type='text/css' href='fullcalendar.css' />
<script type='text/javascript' src='jquery.js'></script>
<script type='text/javascript' src='fullcalendar.min.js'></script>
<script type='text/javascript' src='ui.core.js'></script>
<script type='text/javascript' src='ui.draggable.js'></script>
<script type='text/javascript' src='ui.resizable.js'></script>
None of these files are on github the last 3 are clearly from jquery UI
For some strange reason, when I load my web app on chrome, jquery mobile is flawless but when I try it on my iphone, it never renders properly. The page just crashes and looks awfully bad. I decided to use the cdn because I was told it was faster.
<!-- the three things that jQuery Mobile needs to work -->
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
I copied the above snippet directly from the jquery site. Any suggestions as to why am getting different behaviors?
Now that the JQM 1.1 RC is out, I would like to migrate my 1.0 mobile app to this 1.1 version. How can I do that? Do I have to replace every file or just some specific files? What should be my migration path?
Edit: I plan to use my app using PhoneGap, which means, that I will want to have all resources locally, so no external references.
Adjust your jqm css and js references. Also, you'll need jquery 1.7.1
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0- rc.1.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js"> </script>