• Ifra Saqlain

  • November 19, 2022 04:18

  Community Moderator

  

  

  Hey Raphaël Péguet,

   

  Can be done something like this:

  $('#request_subject').val('Product Registration').css("color","red");
   $('#request_subject').click(function(){
      $(this).val('Product Registration').css("opacity"," .5");
   });
  
  
  Output: 
  Default
  
  
  
  After clicking:
  
  
  
  

   

  Team

• Raphaël Péguet - Officers.fr

  • November 19, 2022 09:58
  • Edited

  Ifra Saqlain Thank you very much Ifra! 

  It works but because of "onclick" function if I write over the "native" text 

  Then go to another field and come back to the previous field to rewrite "the on click function" will erase what I wrote.

  I did a video about it: https://www.loom.com/share/5e5d95df2e2a499787a756d44298126a

  So maybe we should ask a "if" to the "onclick" to say if val = native value then fade if not don't do anything.

  Best regards, 

  Raphaël

   

• Ifra Saqlain

  • November 21, 2022 04:58

  Community Moderator

  

  

  @Raphaël Péguet, try this updated code and remove previous:

      var textOpacity = document.getElementById("request_subject");
      var fieldValue = document.getElementById("request_subject").value = 'CUSTOM TEXT';
      textOpacity.style.color = "red";
    
  window.addEventListener('click', function(e) {   
    if (document.getElementById('request_subject').contains(e.target)){
      textOpacity.style.opacity = "0.5";
    } else{
      textOpacity.style.opacity = "1"
    }
  });

   

  Team

• Raphaël Péguet - Officers.fr

  • November 21, 2022 14:12
  • Edited

  Thank you very much Ifra Saqlain it works perfectly!!

  Best regards,

  Raphaël

• Ifra Saqlain

  • November 22, 2022 04:26

  Community Moderator

  

  

  Great ! :)

Please sign in to leave a comment.