Skip to content

Commit

Permalink
Added scrolling support with ScrollSpy and ScrollTo
Browse files Browse the repository at this point in the history
  • Loading branch information
summerville committed Dec 5, 2011
1 parent f7c7222 commit 3db97f0
Show file tree
Hide file tree
Showing 13 changed files with 1,125 additions and 26 deletions.
10 changes: 10 additions & 0 deletions dynamic/_javascripts.erb
Original file line number Diff line number Diff line change
@@ -1,10 +1,20 @@
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="/js/libs/jquery-1.6.2.min.js"><\/script>')</script>
<script src="/js/libs/bootstrap-scrollspy.js"></script>
<script src="/js/libs/jquery.scrollTo-1.4.2-min.js"></script>
<script src="/js/libs/jquery.colorbox-min.js"></script>

<script>
$(function() {
$("a[rel='colorbox']").colorbox();
$.scrollTo( 0 );

// ScrollTo animation
$(".menu a, .arrows a").click(function(el, e) {
var target = $(this).attr('href');
var position = $(target).position();
$.scrollTo({ top: position.top, left: 0}, 800);
});
});
</script>

Expand Down
15 changes: 8 additions & 7 deletions dynamic/css/rarestep-www.scss
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,7 @@ hr {

// === Menu ===
ul.menu {
@extend .unstyled;
margin-top: 85px;

li {
Expand Down Expand Up @@ -95,18 +96,18 @@ hr {
}

.arrows {
@extend .unstyled;
margin-top: 10px;
text-align: right;

ul {
margin-top: 10px;
}


li {
line-height: 1;

img {
padding: 0px 5px 3px 5px;
a {
display: block;
padding: 0px 5px 1px 5px;
}

}
}
}
Expand Down
34 changes: 19 additions & 15 deletions dynamic/index.haml
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,11 @@
.span9
%h1#hi
We make remarkably useful<br/> web-based software.
.span1.arrows
%ul.unstyled
%li.next.team
%img{ src: '/images/down.jpg', alt: 'next' }
.span1
%ul.arrows
%li
%a{ href: '#work' }
%img{ src: '/images/down.jpg', alt: 'next' }

.panel
%p.lead#love
Expand Down Expand Up @@ -48,13 +49,15 @@
.span9
%h1
Our Work
.span1.arrows
%ul.unstyled
%li.previous.home
%img{ src: '/images/up.jpg', alt: 'up' }
%li.next.products
%img{ src: '/images/down.jpg', alt: 'next' }

.span1
%ul.arrows
%li
%a{ href: '#home' }
%img{ src: '/images/up.jpg', alt: 'prev' }
%li
%a{ href: '#contact' }
%img{ src: '/images/down.jpg', alt: 'next' }

.panel
.row
.span7
Expand Down Expand Up @@ -90,10 +93,11 @@
.span9
%h1
Contact Us
.span1.arrows
%ul.unstyled
%li.previous.home
%img{ src: '/images/up.jpg', alt: 'up' }
.span1
%ul.arrows
%li
%a{ href: '#work' }
%img{ src: '/images/up.jpg', alt: 'prev' }

.panel
%p= lorem.paragraph
8 changes: 4 additions & 4 deletions layouts/default.haml
Original file line number Diff line number Diff line change
Expand Up @@ -28,15 +28,15 @@
/ El Logo
%img{ src: '/images/rarestep_logo.png', alt: 'RareStep' }

%ul.menu.unstyled
%ul.menu{ 'data-scrollspy' => 'scrollspy' }
%li.home.active
%a{ href: '#' }
%a{ href: '#home' }
Home
%li.team
%a{ href: '#' }
%a{ href: '#work' }
Our Work
%li.contact
%a{ href: '#' }
%a{ href: '#contact' }
Contact Us

%footer
Expand Down
113 changes: 113 additions & 0 deletions static/js/libs/bootstrap-alerts.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,113 @@
/* ==========================================================
* bootstrap-alerts.js v1.4.0
* http://twitter.github.com/bootstrap/javascript.html#alerts
* ==========================================================
* Copyright 2011 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ========================================================== */


!function( $ ){

"use strict"

/* CSS TRANSITION SUPPORT (https://gist.github.com/373874)
* ======================================================= */

var transitionEnd

$(document).ready(function () {

$.support.transition = (function () {
var thisBody = document.body || document.documentElement
, thisStyle = thisBody.style
, support = thisStyle.transition !== undefined || thisStyle.WebkitTransition !== undefined || thisStyle.MozTransition !== undefined || thisStyle.MsTransition !== undefined || thisStyle.OTransition !== undefined
return support
})()

// set CSS transition event type
if ( $.support.transition ) {
transitionEnd = "TransitionEnd"
if ( $.browser.webkit ) {
transitionEnd = "webkitTransitionEnd"
} else if ( $.browser.mozilla ) {
transitionEnd = "transitionend"
} else if ( $.browser.opera ) {
transitionEnd = "oTransitionEnd"
}
}

})

/* ALERT CLASS DEFINITION
* ====================== */

var Alert = function ( content, options ) {
this.settings = $.extend({}, $.fn.alert.defaults, options)
this.$element = $(content)
.delegate(this.settings.selector, 'click', this.close)
}

Alert.prototype = {

close: function (e) {
var $element = $(this).parent('.alert-message')

e && e.preventDefault()
$element.removeClass('in')

function removeElement () {
$element.remove()
}

$.support.transition && $element.hasClass('fade') ?
$element.bind(transitionEnd, removeElement) :
removeElement()
}

}


/* ALERT PLUGIN DEFINITION
* ======================= */

$.fn.alert = function ( options ) {

if ( options === true ) {
return this.data('alert')
}

return this.each(function () {
var $this = $(this)

if ( typeof options == 'string' ) {
return $this.data('alert')[options]()
}

$(this).data('alert', new Alert( this, options ))

})
}

$.fn.alert.defaults = {
selector: '.close'
}

$(document).ready(function () {
new Alert($('body'), {
selector: '.alert-message[data-alert] .close'
})
})

}( window.jQuery || window.ender );
62 changes: 62 additions & 0 deletions static/js/libs/bootstrap-buttons.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
/* ============================================================
* bootstrap-dropdown.js v1.4.0
* http://twitter.github.com/bootstrap/javascript.html#dropdown
* ============================================================
* Copyright 2011 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ============================================================ */

!function( $ ){

"use strict"

function setState(el, state) {
var d = 'disabled'
, $el = $(el)
, data = $el.data()

state = state + 'Text'
data.resetText || $el.data('resetText', $el.html())

$el.html( data[state] || $.fn.button.defaults[state] )

state == 'loadingText' ?
$el.addClass(d).attr(d, d) :
$el.removeClass(d).removeAttr(d)
}

function toggle(el) {
$(el).toggleClass('active')
}

$.fn.button = function(options) {
return this.each(function () {
if (options == 'toggle') {
return toggle(this)
}
options && setState(this, options)
})
}

$.fn.button.defaults = {
loadingText: 'loading...'
}

$(function () {
$('body').delegate('.btn[data-toggle]', 'click', function () {
$(this).button('toggle')
})
})

}( window.jQuery || window.ender );
55 changes: 55 additions & 0 deletions static/js/libs/bootstrap-dropdown.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
/* ============================================================
* bootstrap-dropdown.js v1.4.0
* http://twitter.github.com/bootstrap/javascript.html#dropdown
* ============================================================
* Copyright 2011 Twitter, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
* ============================================================ */


!function( $ ){

"use strict"

/* DROPDOWN PLUGIN DEFINITION
* ========================== */

$.fn.dropdown = function ( selector ) {
return this.each(function () {
$(this).delegate(selector || d, 'click', function (e) {
var li = $(this).parent('li')
, isActive = li.hasClass('open')

clearMenus()
!isActive && li.toggleClass('open')
return false
})
})
}

/* APPLY TO STANDARD DROPDOWN ELEMENTS
* =================================== */

var d = 'a.menu, .dropdown-toggle'

function clearMenus() {
$(d).parent('li').removeClass('open')
}

$(function () {
$('html').bind("click", clearMenus)
$('body').dropdown( '[data-dropdown] a.menu, [data-dropdown] .dropdown-toggle' )
})

}( window.jQuery || window.ender );
Loading

0 comments on commit 3db97f0

Please sign in to comment.