La opción de imagen fantasma en el módulo Ordenable se usa para permitir que el usuario haga una copia semitransparente del elemento que se mueve junto con el puntero del mouse. Su valor predeterminado es ‘falso’, lo que significa que no se realiza ninguna copia.
Sintaxis:
Sortable.create('list', {ghosting: boolean})
Los siguientes ejemplos demuestran esta opción:
Ejemplo 1: en este ejemplo, la opción de imagen fantasma se establece en «falso».
HTML
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"
src="prototype.js">
</script>
<script type="text/javascript"
src="scriptaculous.js">
</script>
<style>
li {
cursor: move;
}
</style>
</head>
<body>
<h1 style="color: green;">
GeeksforGeeks
</h1>
<b>
script.aculo.us Sorting
ghosting option
</b>
<ul id="list">
<li>tag</li>
<li>overlap</li>
<li>constraint</li>
<li>containment</li>
<li>handle</li>
</ul>
<script>
Sortable.create('list',
{
tag: 'li',
// Setting the ghosting
// parameter to false
ghosting: false
}
);
</script>
</body>
</html>
Producción:
Ejemplo 2: En este ejemplo, la opción de imagen fantasma se establece en «verdadero».
HTML
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"
src="prototype.js">
</script>
<script type="text/javascript"
src="scriptaculous.js">
</script>
<style>
li {
cursor: move;
}
</style>
</head>
<body>
<h1 style="color: green;">
GeeksforGeeks
</h1>
<b>
script.aculo.us Sorting
ghosting option
</b>
<ul id="list">
<li>tag</li>
<li>overlap</li>
<li>constraint</li>
<li>containment</li>
<li>handle</li>
</ul>
<script>
Sortable.create('list',
{
tag: 'li',
// Setting the ghosting
// parameter to true
ghosting: true
}
);
</script>
</body>
</html>
Producción:
Publicación traducida automáticamente
Artículo escrito por swapnil074 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA