如何修改範圍內的元素

-2

我有一個span元素執行動畫加載。在這個span元素中還有另一個我想修改的元素。我試圖使用CSS來做到這一點，但我不能訪問它，而不會中斷動畫。如何修改範圍內的元素

的Html

<span id="sometext"><a class="sd" href="#">Click here.</a></span> 

<div id="btn">decrypt 
    <div>

CSS

body { 
width: 80%; 
font-family: monospace; 
background-color: #000; 
} 
.code { 
color: #0a0; 
word-break: break-all; 
} 
#sometext { 
color: white; 
} 
.sd { 
color: #000; 
cursor: pointer; 
} 
#btn { 
width: 60px; 
height: 20px; 
color: red; 
padding: 15px; 
border: #fff 2px solid; 
cursor: pointer; 
}

鏈接：http://jsfiddle.net/v9p34o1z/

所有幫助感激！

來源

2014-12-13 B1ll

你究竟在這個範圍內修改了什麼？ – Mattigins 2014-12-13 13:22:17

文本的顏色'點擊這裏'並添加一個鏈接（現在'＃'），而不會影響文本的其餘部分。 – B1ll 2014-12-13 13:26:32

而不是使用.text改變跨度，使用.html，否則HTML將被剝離或呈現爲文本。

function animate(element, options) { 
var text = element.html(), 
    text_only = element.text(), 
    span = $("<span/>").addClass(options.className).insertAfter(element), 
    interval = options.duration/(text_only.length * options.stepsPerGlyph), 
    step = 0, 
    length = 0, 
    stepper = function() { 
     if (++step % options.stepsPerGlyph === 0) { 
      length++; 
      element.html(text.slice(0, length)); 
     } 
     if (length <= text.length) { 
      span.html(randomString(options.codeGlyphs, text_only.length - length)); 
      setTimeout(stepper, interval); 
     } else { 
      span.remove(); 
     } 
    }; 
element.text(""); 
stepper(); 
}

來源

2014-12-13 13:37:14 Mattigins

謝謝，這解決了這個問題。我現在有一個奇怪的加載動畫的問題http://jsfiddle.net/pnrvg8uq/1/。有什麼建議嗎？ – B1ll 2014-12-13 13:46:51

那麼要清楚，這不是答案嗎？ B111，其他用戶會將此視爲答案並被誤導。此外，您從未指定任何有關未更改#something行剩餘部分的內容。你必須在下次做得更清楚，並選擇正確的答案。如果你在這裏搜索答案，那麼你會有什麼感覺？你正在犯新手錯誤，沒關係。只爲下次:)祝你好運 – LOTUSMS 2014-12-13 13:50:11

我已經修改了答案，它看起來更好，但仍然不完美。 – Mattigins 2014-12-13 13:54:32

我不完全知道你正在嘗試做的，添加以下內容到你的CSS沒有擾亂動畫（ATLEAST我）

#sometext { 
    color: blue; 
    cursor: pointer; 
}

來源

2014-12-13 13:33:15 Buster

謝謝。我想在不修改#sometext其餘部分的情況下更改.sd。 – B1ll 2014-12-13 13:36:33

要修改這些文本，先在一個包裹起來跨度標籤，以便您可以定位它們。然後根據使用CSS和下面的行添加到jQuery的

$("#sometext").addClass("yellow");

它添加到CSS，並根據需要

.yellow{ 
    color:yellow !important; 
}

修改檢查UPDATED DEMO

來源

2014-12-13 13:35:03 LOTUSMS

如何修改範圍內的元素

回答

相關問題