entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

1voto

mostrar div oculto atravez de su id con angularJs

hola que tal? soy nueva en el mundo del desarrllo y tengo que entregar un proyecto de frontend. que utilice angularJs, JavaScript, Jquery...
mi pregunta es la siguiente pues estoy muy trabada con esto y no se como hacer...

tengo un archivo JSON donde guardo datos que muestro en la pagina, los datos los muestro atraves de HTTP y utilizo ng-repeat para que muestre todos los que estan dentro de ese object, los muestra como cuadrados independientes que son links para otra pagina.

ahora quiero que cuando paso el mouse por uno de los div el div muestre otro contenido y se ponga en opacity 0.9 y cuando saco el mouse del div vuelve todo a la normalidad.

angular.module("myApp").
controller('cookingCtrl', function ($scope, $http){
        $http.get("js/main.json").then(function(response) {

            //MAIN PAGE  
        $scope.myRecipe = response.data.Main;    

 $scope.description = function(){

        $('.thumbnail').hover(function(){
    $('.description').fadeIn(50);
}, function(){
    $('.description').fadeOut(0);
  });

  };

y lo llamo atraves de ng-mouseover="description()"
el codigo anda pero cuando paso por el mouse me muestra en todos los div lo escrito y no segun en donde pase el mouse....

<div class=" container-fluid text-center">
<div class="row">
    <div class="col-sm-9" ng-controller="cookingCtrl">
       <div class="row"> 
    <div class="col-sm-4" ng-repeat="item in myRecipe">
<div class="thumbnail" id="{{item.id}}">
<a href="{{item.url}}">
    <div class="description">{{item.description}}</div>
<img src="{{item.src}}" alt="{{item.name}}" ng-mouseover="description()">

<div class="caption">
<p><strong>{{item.name}}</strong></p>
</div>
</a>
</div>
</div>

</div> 
</div> 

alguna idea como puedo hacer?
gracias!!!!!

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta