Не может заставить jQuery, изменяемого размера работать: Что я делаю неправильно?

Вы можете попробовать альтернативный способ попасть на панель управления Kibana с помощью команды port-forward вместо прокси-команды, например:

kubectl port-forward service/efk-kibana 5000:443 -n logging

теперь открыт http: // localhost: 5000 in веб-браузер

14
задан MECU 1 August 2010 в 18:45
поделиться

2 ответа

jQuery UI хорошо работает в Вашем образце, проблема, которую Вы имеете, - то, потому что у Вас нет Темы CSS включенной в Ваш последний тест, и "дескриптор изменяемого размера" значок не показывают.

Добавьте свою собственную тему или по умолчанию:

<link rel="stylesheet" type="text/css" 
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css"/>

Посмотрите свой образец здесь.

45
ответ дан 1 December 2019 в 06:04
поделиться

Имейте Вас попробованный:

<script type="text/javascript">
google.setOnLoadCallback(function() {
  $(function() {
    $("#resizable").resizable();
  });
});
</script>

Стоит отметить, что google.load () является асинхронным вызовом, и Вы не сможете вызвать функции jQuery, пока они не будут загружены следовательно обратный вызов.

Хорошо, взглянул на Ваш пример, и у Вас есть несколько проблем:

  1. Это является самым большим: у Вас нет таблицы стилей UI jQuery;
  2. Вы удваиваете включая jQuery, jQuery UI и SWFObject и от Google и от локально;
  3. Последнее отделение в Вашем отделении изменяемого размера блокирует изменение размеров. Не уверенный точно, почему, но я прокомментировал его и это хорошо работает; и
  4. Вам не нужен ключ API для Библиотек Ajax Google API. Этот odesn't вызывает проблему. Это просто к вашему сведению.

Рабочая ваша версия:

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/blitzer/jquery-ui.css">
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1.3.2");
google.load("jqueryui", "1.7.1");
google.load("swfobject", "2.1");
google.setOnLoadCallback(function() {
  $(function() {
    $("#resizable").resizable();
  });
});
</script>
<style type="text/css">
  #resizable { width: 100px; height: 100px; background: silver; }
</style>
</head>
<body>
<div id="resizable">
  <div style="-moz-user-select: none;" unselectable="on" class="ui-resizable-handle ui-resizable-e"></div>
  <div style="-moz-user-select: none;" unselectable="on" class="ui-resizable-handle ui-resizable-s"></div>
  <!--<div unselectable="on" style="z-index: 1001; -moz-user-select: none;" class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se"></div>-->
</div>
</body>
</html>
1
ответ дан 1 December 2019 в 06:04
поделиться
Другие вопросы по тегам:

Похожие вопросы: