右上隅を横切るCSS三角形はどうすれば入手できますか？

Question

私は背景として、私のページに三角形をつけたいと思いますが、イメージなしでそれをやりたいと思います。 私はすでに<aside>のa：before要素を使ってみましたが、jqueryアクセスが必要なので、脇にあるdiv（.triangle）に置き換えました。デスクトップ上では、それは大丈夫だと思われましたが、斜めのエッジはギザギザのようでした。以下のコードとスナップショットhere。

.triangle 
{ 
    position: absolute; 
    top: 0; right: 0; 
    z-index: -1; 
    width: 0; height: 0; 
    border: solid transparent; 
    border-top-color: #CDC7D2; 
    border-left-color: #CDC7D2; 
} 

私が使用してみました：;、しかし要素は、（明らかに）かなりのスクロールを占め始めた「ボーダー幅を3000px」。

次へ私はCSS3グラデーションを使ってみましたが、うまくいきましたが、私の電話（iPhone 4）ではカラーストップの切り替えがぼやけていました。以下のコードとスナップショットhere。むしろ大きな画像を使用して

body 
{ 
    background-image: -webkit-linear-gradient(315deg, #CDC7D2 50%, #FFFFFF 50%); 
    -webkit-background-size: 100% 100%; 
    background-repeat: no-repeat; 
    background-size: 100% 100%; 
} 

は簡単に修正ですが、私はこれをコーディングしようとしているときに、私は何かを逃したかどうかを確認したいと思います。

Answer 1

は、あなたがこのプラグインは、三角形の形状をサポートしていない、次のjQueryのplugin