Added effect on document title hover event
This commit is contained in:
parent
b91e52530f
commit
9853f30563
@ -12,6 +12,7 @@ define([
|
||||
};
|
||||
|
||||
var fileDesc = undefined;
|
||||
var $fileTitleNavbar = undefined;
|
||||
var updateTitle = function(fileDescParameter) {
|
||||
if(fileDescParameter !== fileDesc) {
|
||||
return;
|
||||
@ -19,7 +20,7 @@ define([
|
||||
|
||||
var title = fileDesc.title;
|
||||
document.title = "StackEdit - " + title;
|
||||
$(".file-title-navbar").html(fileDesc.composeTitle());
|
||||
$fileTitleNavbar.html(fileDesc.composeTitle());
|
||||
$(".file-title").text(title);
|
||||
$(".input-file-title").val(title);
|
||||
|
||||
@ -39,6 +40,21 @@ define([
|
||||
documentTitle.onSyncRemoved = updateTitle;
|
||||
documentTitle.onNewPublishSuccess = updateTitle;
|
||||
documentTitle.onPublishRemoved = updateTitle;
|
||||
|
||||
documentTitle.onReady = function() {
|
||||
$fileTitleNavbar = $(".file-title-navbar");
|
||||
// Add a scrolling effect on hover
|
||||
$fileTitleNavbar.hover(function() {
|
||||
var scrollLeft = $fileTitleNavbar[0].scrollWidth - $fileTitleNavbar.outerWidth();
|
||||
$fileTitleNavbar.stop(true, true).animate({
|
||||
scrollLeft: scrollLeft
|
||||
}, scrollLeft * 15, 'linear');
|
||||
}, function() {
|
||||
$fileTitleNavbar.stop(true, true).scrollLeft(0);
|
||||
}).click(function() {
|
||||
$fileTitleNavbar.stop(true, true).scrollLeft(0);
|
||||
});
|
||||
};
|
||||
|
||||
return documentTitle;
|
||||
|
||||
|
@ -305,8 +305,9 @@ body {
|
||||
font-size: 20px;
|
||||
font-weight: 200;
|
||||
color: @btn-success-color;
|
||||
max-width: 320px;
|
||||
max-width: 280px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
i {
|
||||
margin-right: 6px;
|
||||
}
|
||||
@ -1262,6 +1263,10 @@ div.jGrowl {
|
||||
.ui-layout-toggler {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.navbar .file-title-navbar {
|
||||
max-width: 500px;
|
||||
}
|
||||
}
|
||||
|
||||
/*******************
|
||||
|
Loading…
Reference in New Issue
Block a user