2012-04-24 8 views
0

JavaScriptを使用してHTML内の一部のdivの色を変更し、2つの問題があります。 最初のものは、私はCSSの三角形を持っていると私は次のコードでクリックイベントが、文句を言わない仕事上の境界線の色を変更する必要があるということです。JavaScriptを使用して境界線の色を変更し、JavascriptからCookieを保存します。

document.getElementById('triangle').style.borderLeft = color; 

誰でも任意のアイデア?

次の問題は次の問題です。色が変更されたら、クッキーとして保存して、次回訪問時に読み込みたいと思います。 これは私の現在のJavaScriptです:

function change(color) 
{ 
    document.getElementById('tinybox1').style.backgroundColor = color; 
    document.getElementById('tinybox2').style.backgroundColor = color; 
    document.getElementById('tinybox3').style.backgroundColor = color; 
    document.getElementById('tinybox4').style.backgroundColor = color; 
    document.getElementById('text').style.backgroundColor = color; 
    document.getElementById('pinnable').style.backgroundColor = color; 
    // document.getElementById('triangle').style.borderLeft = color; 
} 

私は誰かが私を助けることを願って!これまでのところ、それがそのように行うことができます最初の質問については

+0

は、なぜあなたはjQueryのを使用しようとしないのですか?より簡単になります。 –

答えて

0

もサイズやタイプを、指定しなくてもだけ境界線の色を変更するには、使用:

element.style.borderLeftColor = "#000"; 
+0

デフォルトでは、borderの幅は0になる可能性があるので、borderLeftColorだけが何も与えません。 – VisioN

+0

ボーダー幅がゼロの場合は、質問で説明したようにCSSの三角形ではありません。 –

+0

右、私のせいです。 – VisioN

0

var color = "#000"; 
document.getElementById('triangle').style.borderLeft = "1px solid " + color; 

またはいくつかのスタイルと組み合わせます。

CSS:

#triangle { 
    ... 
    border-left-width: 1px; 
    border-style: solid; 
}​ 

JS:

var color = "#000"; 
document.getElementById('triangle').style.borderLeftColor = color; 
1

最初の質問については、このような@VisioN答え使用:cookiおよそ1秒間

var color = "#000"; 
document.getElementById('triangle').style.borderLeft = "1px solid " + color; 

をES cookie.jsとしてこれを保存して、HTMLでそれをインポートする(あなたは簡単なJavaScriptを使用したいと仮定して)これを試してみてください。

createCookie('cookiename', 'cookievalue', false); 
:今

function createCookie(name,value,days) { 
    var expires = ""; 
    if (days) { 
     var date = new Date(); 
     date.setTime(date.getTime() + (days*24*60*60*1000)); 
     expires = "; expires=" + date.toGMTString(); 
    } 
    else expires = ""; 
    document.cookie = name + "=" + value + expires + "; path=/"; 
} 

function readCookie(name) 
{ 
    var nameEQ = name + "="; 
    var ca = document.cookie.split(';'); 
    for(var i=0;i < ca.length;i++) 
    { 
     var c = ca[i]; 
     while (c.charAt(0)==' ') c = c.substring(1, c.length); 
     if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); 
    } 
    return null; 
} 

function eraseCookie(name) 
{ 
    createCookie(name,"",-1); 
} 

、クッキーを作成するには、次の手順を実行します

がクッキーを評価するために、次の操作を行います。このことができます

var cookie = readCookie('cookiename'); 

// var cookie will be null if there is no cookie to read. 
if(cookie == 'cookievalue'){ 
    //do something 
} 

希望を。

関連する問題