Comment supprimer les propriétés hover de WinJS ListView?

Question

Je suis en train de développer une application Windows Universal utilisant WinJS, mais la personnaliser est assez difficile et j'ai besoin de suivre quelques instructions de conception.

Le problème se produit lorsque j'essaie de supprimer la propriété hover de l'élément de liste. Lorsque ma souris est sur l'élément, le div obtient un arrière-plan plus sombre. J'ai essayé de l'enlever avec

.win-listview .win-container:hover{ 
    background-color: transparent; 
} 

et aussi avec

.win-selectionbackground { 
    opacity: 0; 
} 

Mais il ne fonctionne pas.

Voici un code pour aider:

<!-- TEMPLATES --> 
<div class="storyPhotoTemplate" data-win-control="WinJS.Binding.Template" style="display: none"> 
    <div class="story-photo-icons"> 
     <div style="height: 250px; width: 22px;position:relative; float: left;"> 
      <img class='xButton smaller' src = '../../images/x-icon.png' /> 
     </div> 
     <div class="pic-area"> 
      <img src="#" class="story-photo" data-win-bind="src: image" /> 
     </div> 

    </div> 
</div> 

<section class="gallery"> 
    <div class="button lBtn"></div> 
    <!-- CONTENT --> 
    <div id="storyPhotoGrid" 
     class="win-selectionstylefilled" 
     data-win-control="WinJS.UI.ListView" 
     data-win-options="{ 
      itemDataSource: Photos.StoryGrid.dataSource, 
      itemTemplate: select('.storyPhotoTemplate'), 
      selectionMode: 'none', 
      tapBehavior: 'none', 
      layout: { type: WinJS.UI.GridLayout, orientation:'horizontal' } 
    }"> 
    </div> 

L'arbre DOM construit par le cadre est pas évident. Si quelqu'un a besoin de plus d'informations, dites-le moi et je mettrai à jour la question.

Answer 1

Le comportement de vol stationnaire pour l'élément ListView est défini dans

html.win-hoverable .win-selectionstylefilled .win-container:hover .win-itembox, 
html.win-hoverable .win-selectionstylefilled.win-container:hover .win-itembox 
{ 
    background-color: rgba(255, 255, 255, 0.1); 
} 

Vous pouvez trouver dans ui-light.css ou ui-dark.css fichiers de WinJS lib, selon le thème que vous utilisez.

Donc, si vous voulez désactiver la couleur de fond sur le vol stationnaire, changer le style comme ci-dessous:

html.win-hoverable .win-selectionstylefilled .win-container:hover .win-itembox, 
html.win-hoverable .win-selectionstylefilled.win-container:hover .win-itembox 
{ 
    background-color:transparent; 
}