Подскажите по jquery

rasandrey · 22 Мар 2010

Есть такой сайтик Для просмотра ссылки Войди или Зарегистрируйся....

На нем используется скрипт который может масштабировать изображения(если ухватить за правый нижний угол изображения). Может кто знает такой подобный на jquery?

С перетаскиванием проблем нету, а вот сделать автоматический ресайз изображения с помощью скрипта ,например, Для просмотра ссылки Войди или Зарегистрируйся не получается

polyetilen · 23 Мар 2010

первый вариант если картинка внутри элемента с resizable то помогает width="100%" height="100%" на картинке, второй вариант сразу на картинку поместить resizable

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>jQuery UI Resizable - Default functionality</title>
    <link type="text/css" href="http://jqueryui.com/themes/base/jquery.ui.all.css" rel="stylesheet">
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js"></script>
    <link type="text/css" href="http://jqueryui.com/demos/demos.css" rel="stylesheet">
    <style type="text/css">
    #resizable { width: 150px; height: 150px; padding: 0.5em; }
    #resizable h3 { text-align: center; margin: 0; }
    </style>
    <script type="text/javascript">
    $(function() {
        $("#resizable").resizable();
        $("#resizable_image").resizable();
    });
    </script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<div class="demo">

DIV
<div id="resizable" class="ui-widget-content">
    <h3 class="ui-widget-header">Resizable</h3>
    <img src="http://www.google.com/intl/en_com/images/logo_plain.png" width="100%" height="100%">
</div>

IMG
<img src="http://www.google.com/intl/en_com/images/logo_plain.png" id="resizable_image">


</div><!-- End demo -->

<div class="demo-description">

<p>Enable any DOM element to be resizable.  With the cursor grab the right or bottom border and drag to the desired width or height.</p>

</div><!-- End demo-description -->
</body>
</html>

Подскажите по jquery

rasandrey

Участник

polyetilen

Заблокирован