diff --git a/index.htm b/index.htm
index 52bbebc..6b321b5 100644
--- a/index.htm
+++ b/index.htm
@@ -406,15 +406,30 @@
border-radius: 5px;
color: #000;
padding: 4px 10px;
- transition: all 0.3s linear;
+ transition: all 0.1s linear;
border: 1px solid transparent;
left: -50px !important;
+ cursor: pointer;
+ -webkit-touch-callout: none; /* iOS Safari */
+ -webkit-user-select: none; /* Safari */
+ -khtml-user-select: none; /* Konqueror HTML */
+ -moz-user-select: none; /* Firefox */
+ -ms-user-select: none; /* Internet Explorer/Edge */
+ user-select: none; /* Non-prefixed version, currently
+ supported by Chrome and Opera */
+
}
.scoreBox:hover {
box-shadow: 0 0 3px rgba(0,0,0,0.3);
border-color: red;
- color: red;
+ user-select: none;
+ z-index: 9;
+ }
+ .scoreBox.active {
+ box-shadow: 0 0 3px rgba(0,0,0,0.3);
+ background-color: red;
+ color: white;
z-index: 9;
}
@@ -443,6 +458,7 @@
margin: 0 auto;
}
+
#displaySetting .character-line {
position: relative;
line-height: 0;
@@ -826,6 +842,24 @@
top: 0;
background: rgba(0,0,0,0.3);
}
+ .setting-button {
+ border: 2px solid #666666;
+ border-radius: 5px;
+ display: block;
+ padding: 2px 5px;
+ position: fixed;
+ right: 20px;
+ top: 20px;
+ width: 42px;
+ z-index: 9;
+ }
+ .setting-button span {
+ height: 2px;
+ display: block;
+ background: #666666;
+ border-radius: 3px;
+ margin: 5px 0;
+ }
@@ -833,34 +867,9 @@
-
+
+
+
@@ -2273,16 +2282,36 @@
};
this.characterClick = function () {
$(document).on('click', '.char-line svg', function () {
+ var charaterSVG = $('.char-line svg');
if ($(this).hasClass('active')) {
$(this).removeClass('active');
- $('.char-line svg').removeClass('disable')
+ charaterSVG.removeClass('disable')
} else {
$(this).addClass('active');
- $('.char-line svg').addClass('disable')
+ charaterSVG.addClass('disable')
}
})
};
-
+ this.scoreBoxClick = function () {
+ $(document).on('click', '.character-line .scoreBox', function () {
+ var lineSVG = $(this).prev();
+ var charaterLine = $('.character-line .char-line');
+ var charaterSVG = $('.char-line svg');
+ if($(this).hasClass('active')) {
+ $(this).removeClass('active');
+ charaterLine.css('visibility','visible')
+ charaterSVG.removeClass('disable active');
+
+ } else {
+ $('.character-line .scoreBox').removeClass('active');
+ $(this).addClass('active');
+ charaterLine.css('visibility','hidden')
+ lineSVG.css('visibility','visible');
+ charaterSVG.removeClass('disable active')
+ }
+
+ })
+ };
this.UpdateSetting = function () {
var callBackFunction = this;
$('#updateSetting').on('click', function () {
@@ -2505,6 +2534,7 @@
});
this.ScrollOnClick();
this.characterClick();
+ this.scoreBoxClick();
// this.ValidateFunction();
};
};