Do not save your changes

by hamesashek July 4th 2017, 4:52 pm

Hello

I have a problem with this code

Do not save your changes

This code places a specific color into a specific item, but a problem occurs when the page is not updated and it returns to its default state

If you can help

Show icon:

Code:: $(document).ready(function(){ $(function(){ $('#colorwheel .colors').each(function(i){ $(this).attr('id','color_' + ++i); }); }); var speed = 500; function hex(rgb){ rgb = rgb.match(/^rgb$(\d+),\s*(\d+),\s*(\d+)$$/); return '#' + ('0' + parseInt(rgb[1],10).toString(16)).slice(-2) + ('0' + parseInt(rgb[2],10).toString(16)).slice(-2) + ('0' + parseInt(rgb[3],10).toString(16)).slice(-2); } $(function(){ $('.prev').bind('click',function(){ slide('prev'); }); $('.next').bind('click',function(){ slide('next'); }); $('.colors').last().addClass('active'); function slide($control) { var $active = $('.active'), $next = $active.next().length ? $active.next() : $('.colors').first(), $prev = $active.prev().length ? $active.prev() : $('.colors').last(); console.log('next',$next); console.log('prev',$prev); if ($control === 'next'){ console.log($control); $active.removeClass('active'); $next.addClass('active'); var $activeBg = $('.active .color').first().css('backgroundColor'); $('#info .info-bg').animate({ backgroundColor: $activeBg },speed); $('#info .arrow').animate({ 'border-bottom-color': $activeBg },speed); var big = $('.active .color').first().css('backgroundColor'), medium = $('.active .color').first().next().css('backgroundColor'), small = $('.active .color').last().css('backgroundColor'); $('#info .values .big span').text(hex(big)); $('#info .values .medium span').text(hex(medium)); $('#info .values .small span').text(hex(small)); } if ($control === 'prev'){ console.log($control); $active.removeClass('active'); $prev.addClass('active'); var $activeBg = $('.active .color').first().css('backgroundColor'); $('#info .info-bg').animate({ backgroundColor: $activeBg },speed); $('#info .arrow').animate({ 'border-bottom-color': $activeBg },speed); var big = $('.active .color').first().css('backgroundColor'), medium = $('.active .color').first().next().css('backgroundColor'), small = $('.active .color').last().css('backgroundColor'); $('#info .values .big span').text(hex(big)); $('#info .values .medium span').text(hex(medium)); $('#info .values .small span').text(hex(small)); } } }); $(function(){ var $activeBg = $('.active .color').first().css('backgroundColor'); $('#info .info-bg').css({ backgroundColor: $activeBg }); $('#info .arrow').css({ 'border-bottom-color': $activeBg }); var big = $('.active .color').first().css('backgroundColor'), medium = $('.active .color').first().next().css('backgroundColor'), small = $('.active .color').last().css('backgroundColor'); $('#info .values .big span').text(hex(big)); $('#info .values .medium span').text(hex(medium)); $('#info .values .small span').text(hex(small)); }); $(function(){ var $frame = $('.frame'), angle = 0; $('.next').rotate({ bind: { click: function(){ angle -= 30; $frame.rotate({ duration: speed*2, animateTo: angle, easing: $.easing.easeOutElastic }); } } }); $('.prev').rotate({ bind: { click: function(){ angle += 30; $frame.rotate({ duration: speed*2, animateTo: angle, easing: $.easing.easeOutElastic }); } } }); }); });

by hamesashek July 6th 2017, 1:21 am

Does anyone know its programming?

Is there no help?

by **SLGray** July 6th 2017, 1:29 am

I really do not understand the issue. Could you please screenshots of the issue?

by hamesashek July 7th 2017, 12:49 am

Hi

How can I put cookies?

To save the changes you made to the JavaScript example?

Code:: var themeCookie=my_getcookie("bubcloud");""!==themeCookie&&null!==themeCookie&&(themeCookie=themeCookie.split("|"),themeChoose(themeCookie[0],themeCookie[1],themeCookie[2]),

by **SLGray** July 8th 2017, 3:49 am

What do mean by when the page is not updated?

by Guest July 8th 2017, 6:31 am

Hi,

I don't understand what that code is supposed to do. If you want to save something, I would recommend using the localStorage API instead of the cookies. It's much easier to use in my opinion:

Code:: if(localStorage && localStorage.getItem("item")){ /*The data is saved and can be used:localStorage.getItem("item") or localStorage.item returns the data*/ } else { /*The data is not saved, we have to get it and then save it with localStorage.setItem("item", "data")*/ }

About the localStorage API's methods:
-getItem()
it receives the name of the item as a parameter and returns it's value if it exists or null if it doesn't exists
-setItem()
it receives the name of the item as the first parameter and the value as the second parameter
-deleteItem()
it receives the name of the item as the parameter and deletes that item from localStorage