Fügen Sie Gradienten -Hintergrundfarbe hinzu, um Zeilen mit JQuery anzeigen

Question

In SharePoint 2007 Verwenden von Inhaltstypen und Reding von NewForm.aspx mit JQuery habe ich es geschafft, das Aussehen eines neuen Elements anzupassen und für jeden Inhaltstyp eine Gradientenfarbenidentität hinzuzufügen. Ich möchte diesen Blick auch in den Ansichten fortsetzen. Für die Ansicht "Alle Elemente" habe ich ein Web -Editor -Webpart hinzugefügt, in dem ich Stile und JQuery -Skript codiert habe. Ich möchte in der Ansicht Gradientenfarben anzeigen und das in Firefox erreicht, aber IE8 scheint resistent zu sein.

Im Web -Teil des Contenteditors habe ich Code, der in ForeFox funktioniert, aber nicht in IE8. Das Problem scheint zu sein, dass IE8 keine JQuery -Erklärung behandelt: $ Text.parent ();.

Frage: Kennt jemand eine Möglichkeit, einem Elternteil eine Klasse hinzuzufügen, ohne obj.parent () zu verwenden? Oder gibt es eine IE -Problemumgehung für dieses Problem?

Übrigens funktioniert diese jQuery -Erklärung in IE8: $ Text.parent (). CSS ("Hintergrundfarbe", "#ff0000");, Es ist jedoch ohne die Gradientenqualitäten.

Danke im Voraus,

-Arnold

Code:

<style type="text/css">
.formRedBackground
{
    background: white;
    background: -moz-linear-gradient(top, white, #FF0000);
    background: -webkit-gradient(linear, left top, left bottom, from(white), to  (#FF0000));
    filter:progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')
    filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='white', EndColorStr='#FF0000', gradientType='0');
    color:#FFFFFF;
}

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.js"></script>

<script type="text/javascript">
$(document).ready(function(){
$Text = $("td .ms-vb2:contains('Red')");
var myelement = $Text.parent();
myelement.addClass('formRedBackground');

});

Answer 1

Ich fand die Antwort auf meine Frage. Ich habe die jQuery geändert, um eine Funktion auf dem übergeordneten TD auszuführen. Am Ende habe ich auch meine Anforderungen geändert, so dass nur die ersten beiden TD -Elemente in einem TR farbig sind.

Hier ist der Code, falls er jemand anderem hilft:

<script type="text/javascript">
$(document).ready(function(){

$Text = $("td .ms-vb2:contains('Beige')");
$Text.parent().each(function() { $("td:lt(2)", this).addClass("formBeigeBackground");});

$Text = $("td .ms-vb2:contains('Black')");
$Text.parent().each(function() { $("td:lt(2)", this).addClass("formBlackBackground");});

$Text = $("td .ms-vb2:contains('Lavender')");
$Text.parent().each(function() { $("td:lt(2)", this).addClass("formLavenderBackground");});

$Text = $("td .ms-vb2:contains('Pink')");
$Text.parent().each(function() { $("td:lt(2)", this).addClass("formPinkBackground");});

$Text = $("td .ms-vb2:contains('Red')");
$Text.parent().each(function() { $("td:lt(2)", this).addClass("formRedBackground");});

});
</script>

Dies ist eine großartige Seite,

-Arnold