Opened 6 years ago

Last modified 6 years ago

#15045 closed bug

Resizable: Resizable is not working from 1.8.4+ version — at Initial Version

Reported by: tranquilodf Owned by:
Priority: minor Milestone: none
Component: ui.resizable Version: 1.12.0
Keywords: Cc:
Blocked by: Blocking:

Description

Hi! I am studying jQuery and when I'm trying to make an example of the default format and it is not working when I use versions 1.8.4+. Below is the code to check:

  • Running code: 
<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>jQuery UI Resizable functionality</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/jquery-ui.js"></script>
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/themes/base/jquery-ui.css"/>

    <!-- CSS -->
    <style>
        .ui-widget-header {
            background:#b9cd6d;
            border: 1px solid #b9cd6d;
            color: #FFFFFF;
            font-weight: bold;
        }
        .ui-widget-content {
            background: #cedc98;
            border: 1px solid #DDDDDD;
            color: #333333;
        }
        #resizable { width: 150px; height: 150px; padding: 0.5em;text-align: center; margin: 0; }
    </style>
    <script type="text/javascript" src="js/Aula41.js"></script>
</head>

<body>

<!-- HTML -->
<div id="resizable" class="ui-widget-content">
    <h3 class="ui-widget-header">Pull my edges to resize me!!</h3>
</div>

<textarea id="resizable2" class="ui-widget-content" rows="5"></textarea>

</body>
</html>
  • Code with new version and what does not: 
<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>jQuery UI Resizable functionality</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/jquery-ui.js"></script>
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/themes/base/jquery-ui.css"/>

    <!-- CSS -->
    <style>
        .ui-widget-header {
            background:#b9cd6d;
            border: 1px solid #b9cd6d;
            color: #FFFFFF;
            font-weight: bold;
        }
        .ui-widget-content {
            background: #cedc98;
            border: 1px solid #DDDDDD;
            color: #333333;
        }
        #resizable { width: 150px; height: 150px; padding: 0.5em;text-align: center; margin: 0; }
    </style>
    <script type="text/javascript" src="js/Aula41.js"></script>
</head>

<body>

<!-- HTML -->
<div id="resizable" class="ui-widget-content">
    <h3 class="ui-widget-header">Pull my edges to resize me!!</h3>
</div>

<textarea id="resizable2" class="ui-widget-content" rows="5"></textarea>

</body>
</html>

Change History (0)

Note: See TracTickets for help on using tickets.