1

私がやりたいことは、ユーザーがページを更新したときに CSS スタイルを保存することです。これは私のjQueryコードです:

$(function() {

$("#slider").draggable({
    axis: 'x',
    containment: 'parent',
    drag: function(event, ui) {
        if (ui.position.left > 230) {
            $("#well").fadeOut();
            $( "#well" ).addClass( "disappear" );
        } else {
            // Apparently Safari isn't allowing partial opacity on text with background clip? Not sure.
            // $("h2 span").css("opacity", 100 - (ui.position.left / 5))
        }
    },
    stop: function(event, ui) {
        if (ui.position.left < 231) {
            $(this).animate({
                left: 0
            })
        }
    }
});

$('#slider')[0].addEventListener('touchmove', function(event) {
    event.preventDefault();
    var el = event.target;
    var touch = event.touches[0];
    curX = touch.pageX - this.offsetLeft - 73;
    if(curX <= 0) return;
    if(curX > 230){
        $('#well').fadeOut();
    }
    el.style.webkitTransform = 'translateX(' + curX + 'px)'; 
}, false);

$('#slider')[0].addEventListener('touchend', function(event) {  
    this.style.webkitTransition = '-webkit-transform 0.3s ease-in';
    this.addEventListener( 'webkitTransitionEnd', function( event ) { this.style.webkitTransition = 'none'; }, false );
    this.style.webkitTransform = 'translateX(0px)';
}, false);

});

クラス「消える」が追加されたら、ページがリロードされても追加したままにしたいと思います。ここに役立つ投稿を見つけましたが、私はJavascriptの初心者であるため、私の場合の使用方法がわかりません.誰かが私に個人的な回答をしてくれると本当にうれしいです.

前もって感謝します！

4

2 に答える 2

0

これでほとんどの作業が完了します。

var setClass = JSON.parse(localStorage.getItem('setClass')) || {};
$.each(setClass, function () {
    $(this.selector).addClass(this.className);
});
var addClassToLocalStorage = function(selector, className) {
    setClass[selector + ':' + className] = {
        selector: selector,
        className: className
    };
    localStorage.setItem('setClass', JSON.stringify(setClass));
};
var removeClassFromLocalStorage = function(selector, className) {
    delete setClass[selector + ':' + className];
    localStorage.setItem('setClass', JSON.stringify(setClass));
};

次に、これを行うことができます：

$("#well").fadeOut();
$("#well").addClass("disappear");
addClassToLocalStorage('#well', 'disappear');
// remove it removeClassFromLocalStorage('#well', 'disappear');

フィドル

その後、必要に応じて再利用できます。

于 2013-08-16T14:20:45.343 に答える
0

$( "#well" ).addClass( "disappear" );追加後

localStorage['wellClass'] = 'disappear';

そして、下の行に$(function() {追加します

previousWellClass = localStorage['wellClass'];
if (previousWellClass) $('#well').addClass(previousWellClass);
于 2013-08-16T14:05:10.017 に答える