Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Newer
Older
100644 104 lines (61 sloc) 5.506 kB
cf71734 @justinmarsan First README
authored
1 MobileReadyFramework
2 ====================
3
9ced70e @justinmarsan Updated the README
authored
4 What is it?
5 -----------
6
7 So far, MRF has been a (dead project) uhm, an experiment, I was searching for a way to make cross devices websites with performances in mind... The result is a "big" framework, Javascript and CSS powered that will allow you (if you give it a try) to make websites loading content depending on the browser's size to avoid big files loading on mobile devices and poor quality graphics on bigger screens.
cf71734 @justinmarsan First README
authored
8
9ced70e @justinmarsan Updated the README
authored
9 The issue right now is that I feel it is too difficult to use, and does more than it should resulting in a huge pile of code. I'm now in the process of making it cleaner and simpler to use, and as soon as I'm happy with the result, I'll be working on a demo website to show it's power (assuming it has some...).
cf71734 @justinmarsan First README
authored
10
37ea15a @justinmarsan More informations
authored
11
12 Usage : Html
13 ------------
14
9ced70e @justinmarsan Updated the README
authored
15 These are classic HTML files, the only "new" thing is the code written in comments. This will be un-commented in JS so that only content you want to show is loaded in the visitor's device.
37ea15a @justinmarsan More informations
authored
16
17
18 Usage : Css
19 -----------
20
9ced70e @justinmarsan Updated the README
authored
21 I decided that trying to make it easy to use in "bare" CSS and LESS was simply too much work, and a bit pointless so thses files will simply be the raw exports LESS creates. If you want to use those, the only files you will have to work in are base.css and style.css
37ea15a @justinmarsan More informations
authored
22
9ced70e @justinmarsan Updated the README
authored
23 base.css is the file loaded "by default", it contains the reset, the mobile style and some more code such as third-party libraries.
24
25 style.css is the complete one with media-queries, and all the device-specific styles.
fbf23e7 @justinmarsan ReadMe now explaining what base.csss is
authored
26
37ea15a @justinmarsan More informations
authored
27
28 Usage : Less
29 ------------
30
9ced70e @justinmarsan Updated the README
authored
31 If (like me) you like LESS, than you'll have the benefit of using separated files to code (while they will be exported in base.css and style.css automatically when compiling). The file names are pretty straight-forward, but here is a short list :
32
33 base.less imports all the files needed for the base style loaded if JS isn't enabled, including reset, mobile and plugins.
34
35 style.less imports all the files of the project including reset, plugin and all the size-specific stylesheets
36
37 mobile.less tablet.less desktop.less bigscreen.less and hdtv.less are size-specific stylesheets and contains the media-queries to target the specified sizes.
38
39 plugin.less contains the styles you may have to/want to use for third-party scripts such as a JQuery plugin.
40
41 For more informations about LESS see http://lesscss.org/
37ea15a @justinmarsan More informations
authored
42
9ced70e @justinmarsan Updated the README
authored
43 If you're on Mac and like GUI applications more than commande line tools, I recommend Less.app ( http://incident57.com/less/ Mac only) which is great and will allow you to use LESS simply without remembering command line stuff (cman, we all know designers prefer pretty simple things that work rather than the Terminal :p ).
37ea15a @justinmarsan More informations
authored
44
45
46
47 Usage : JS
48 ----------
49
8e95235 @justinmarsan MRF isn't using jQuery anymore, if you want to get rid of it for mobi…
authored
50 The JS probably is the only *really* new thing this framework provides... To put it simply, it brings media-queries to HTML.
37ea15a @justinmarsan More informations
authored
51
8e95235 @justinmarsan MRF isn't using jQuery anymore, if you want to get rid of it for mobi…
authored
52 I know what you're thinking : "It's possible to show and hide content with CSS so what the point of it ?" Well the thing is, lots of browsers wil load content even if it's hidden in CSS, if it's a big image you wanted to use on desktop, chances are mobiles will load it too even if it doesn't appear, and this really sucks because mobile phones don't always have good internet connection, and it's useless bandwidth used.
1320142 @justinmarsan updated README
authored
53
8e95235 @justinmarsan MRF isn't using jQuery anymore, if you want to get rid of it for mobi…
authored
54 So what mrf-functions.js does is allow you to make some code visible depending on the size of the screen, like I said, media-queries for HTML. To make it simpler, it's using the sizes already set in the CSS media-queries and some keywords so that you don't need to remember the numbers.
37ea15a @justinmarsan More informations
authored
55
8e95235 @justinmarsan MRF isn't using jQuery anymore, if you want to get rid of it for mobi…
authored
56 *(longer explanations will be there soon)*
e47ce0b @justinmarsan lazy loading inheritance configuration added
authored
57
58
fa28d00 @justinmarsan update the README
authored
59
60 Usage : Design
61 --------------
62
63 The framework by default comes with pre-set media-queries and uses sizes from 978.gs for mobile.less tablet.less desktop.less and bigscreen.less... Unfortunately nothing was provided for bigger than that so I made hdtv.less's size myself.
64
65 You can download templates for those layouts on www.978.gs
66
67
37ea15a @justinmarsan More informations
authored
68 To-do
69 -----
70
8e95235 @justinmarsan MRF isn't using jQuery anymore, if you want to get rid of it for mobi…
authored
71 * Make a great example showing how awesome this framework is
37ea15a @justinmarsan More informations
authored
72
cf71734 @justinmarsan First README
authored
73 Credits
74 -------
75
76 Made by Justin Marsan ( www.justinmarsan.com )
77 Original idea form Kahlil Lechelt ( http://kahlillechelt.com/ )
3fc5dca @justinmarsan add MIT license
authored
78 Discussion on Forrst ( http://forrst.com/posts/Perfect_All_Around_Bullet_Proof_CSS_Framework_F-gj4 )
4e8a7b1 @justinmarsan some credits added
authored
79 JQuery ( www.jquery.com )
8e95235 @justinmarsan MRF isn't using jQuery anymore, if you want to get rid of it for mobi…
authored
80 LazyRender ( http://webbricks.org/bricks/jQuery.lazyRender/ ) *this isn't used anymore but have been a good ressource to help me code the actual (raw) JS lazy loading functions*
3fc5dca @justinmarsan add MIT license
authored
81
82
83 License
84 -------
85
86 Copyright (C) 2011 by Justin Marsan
87
88 Permission is hereby granted, free of charge, to any person obtaining a copy
89 of this software and associated documentation files (the "Software"), to deal
90 in the Software without restriction, including without limitation the rights
91 to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
92 copies of the Software, and to permit persons to whom the Software is
93 furnished to do so, subject to the following conditions:
94
95 The above copyright notice and this permission notice shall be included in
96 all copies or substantial portions of the Software.
97
98 THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
99 IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
100 FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
101 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
102 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
103 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
104 THE SOFTWARE.
Something went wrong with that request. Please try again.