locked
What is wrong with this code? RRS feed

  • Question

  • User-2071692902 posted

    Hi,

    According to the post below, i modified the code to enlarge the emoji to be as a sticker

    https://forums.asp.net/t/2151064.aspx?

    Here my new code 

    <script>
             $(function () { 
               var d = new Date()
               var h12 = d.getHours();
               var h24 = d.getHours();
               var m = d.getMinutes();
               var s = d.getSeconds();
               if (s < 10) {
                   s = "0" + s
               }
               if (m < 10) {
                   m = "0" + m
               }
               if (h12 > 12) {
                   h12 = h12 - 12
               }
               if (h12 == 00) {
                       h12  = 12
                   }
    
               var timeStamp = h12 + ":" + m + ":" + s + " ";
               if (h24 > 11) {
                   timeStamp += "PM";
               } else {
                   timeStamp += "AM";
               }
    
               var userName = document.getElementById("myUserName").value;
               var img = $('<img width="100px;" height=" 100px">');
              $("div.dropdown-menu a").click(function () {
              $('#conDivID').append("<span style='color: red'>" + userName + ': </span>');
              $('#conDivID').append('</br>');
              $("#conDivID").append($(this).find("img").clone(true)); 
              $('#conDivID').append('</br>');
              $('#conDivID').append("<span class='timeSpan'>" + timeStamp + '</span>');
              $('#conDivID').append('</br>');
                   
             });
             })
         </script>

     I want to change the size of the image from 20px[ as it in the given code in previous post] to 100px [as in my modified code above].

    Thanks advanced

    Monday, January 28, 2019 3:37 PM

Answers

  • User839733648 posted

    Hi Omanxp45-1,

    Do you want the effect like this?

    If it is, you just have to set the image's height in CSS style.

            #conDivID img {
                height:100px;
            }

    Best Regards,

    Jenifer

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, February 4, 2019 2:26 AM

All replies

  • User-474980206 posted

    you create a variable "img" that you never use. you clone an image, but don't change any properties of it.

    Monday, January 28, 2019 4:45 PM
  • User-2071692902 posted
    Then how could I use my variable in the original code?
    Monday, January 28, 2019 7:30 PM
  • User753101303 posted

    Hi,

    You could add an id to your image and use $("#myId").css("width","100px"); to change the width. Currently you are using attributes which are outdated since long. Use CSS instead ie :

    <img style="width:20px;heigh:20px"> rather than <img width="20p"x height="20"px>

    Monday, January 28, 2019 7:52 PM
  • User-2071692902 posted
    You mean like this
    var userName = document.getElementById("myUserName").value;
    var img = $('<img width="100px;" height=" 100px">');
    $("div.dropdown-menu a").click(function () {
    $('#conDivID').append("<span style='color: red'>" + userName + ': </span>');
    $('#conDivID').append('</br>');
    $("#conDivID").append($(this).find("img id="imgId"").clone(true));
    $("#imgId").css("width","100px");
    $('#conDivID').append('</br>');
    $('#conDivID').append("<span class='timeSpan'>" + timeStamp + '</span>');
    $('#conDivID').append('</br>');
    Monday, January 28, 2019 8:15 PM
  • User839733648 posted

    Hi Omanxp45-1,

    According to your description, do you want someting like this?

    I suggest you could just delete the image style, and just set the css to the image like:

            img .dropdown-menu{
                height:100px;
            }

    Best Reagrds,

    Jenifer

    Wednesday, January 30, 2019 10:05 AM
  • User-2071692902 posted
    Sorry, but I want to keep images in tge dropdown menu as small as icons.
    Wednesday, January 30, 2019 11:40 AM
  • User753101303 posted

    Yes like $("#imgId").css("width","100px"); 

    When using $("<tagName>") you create a new element rather than retrieving an existing element (and it doesn't seems, you are using it at all). See http://api.jquery.com/jquery/ and note that you have jQuery(selector), jQuery(html) and jQuery(callback) $() being a shortcut for jQuery(). https://www.w3schools.com/jquery/jquery_css.asp could also perhaps help.

    Wednesday, January 30, 2019 11:44 AM
  • User-2071692902 posted

    I tried to use it in .ready block of jQuery but it didn't work.

     <script >
    $(document).ready(function(){
     $("#imgId").css("width","100px"); 
    
        
    });     
         </script>

    Thursday, January 31, 2019 2:27 PM
  • User839733648 posted

    Hi Omanxp45-1,

    I'm still confused that which image you want to change its width.

    Is the image already created in the html or in the jquey code?

    I've added extra image and set its width, it works well.

    <img src="Images/test1.jpg" style="width:40px" id="testimg"/>
    
    $("#testimg").css("width", "100px");

    Best Regards,

    Jenifer

    Friday, February 1, 2019 9:40 AM
  • User753101303 posted

    And you are 100% sure that your img tag does have the "imgId" id ?

    Friday, February 1, 2019 11:43 AM
  • User-2071692902 posted
    Hi,
    I want when I press on any image(emoji) inside the dropdown-menu to be sent to the conversation box ('#conDivID') with its full size.
    Friday, February 1, 2019 11:50 AM
  • User839733648 posted

    Hi Omanxp45-1,

    Do you want the effect like this?

    If it is, you just have to set the image's height in CSS style.

            #conDivID img {
                height:100px;
            }

    Best Regards,

    Jenifer

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, February 4, 2019 2:26 AM