Prosseguindo com alguns códigos que uso sempre, abaixo mostro um drag-n-drop feito pelo tmferreira e corrigido por mim. Logicamente serve pra arrastar e mover elementos, divs, etc.
Uso ele quando não to afim de usar libs completas como o jquery.
Vou deixar direto o código completo até com o exemplo de uso. É só salvar o conteúdo abaixo como um arquivo HTML qualquer e testar. Pra ativar o drag-n-drop nos seus elementos e páginas, é só entender o exemplo e chamar a função dragdrop para os elementos que desejar.
<script>
//drag n drop de div ----------------------------------------------------
//by tmferreira - http://www.webly.com.br/tutorial/javascript-e-ajax/7045/drag-and-drop.htm
//corrigida 30/01/2008 por Micox - http://forum.ievolutionweb.com/index.php?s=&showtopic=7045&view=findpost&p=139679
var objSelecionado = null;
var mouseOffset = null;
function addEvent(obj, evType, fn) {
//Função adaptada da original de Christian Heilmann, em
//http://www.onlinetools.org/articles/unobtrusivejavascript/chapter4.html
if (typeof obj == "string") {
if (null == (obj = document.getElementById(obj))) {
throw new Error("Elemento HTML não encontrado. Não foi possÃvel adicionar o evento.");
}
}
if (obj.attachEvent) {
return obj.attachEvent(("on" + evType), fn);
} else if (obj.addEventListener) {
return obj.addEventListener(evType, fn, true);
} else {
throw new Error("Seu browser não suporta adição de eventos. Senta, chora e pega um navegador mais recente.");
}
}
function mouseCoords(ev){
if(typeof(ev.pageX)!=="undefined"){
return {x:ev.pageX, y:ev.pageY};
}else{
return {
x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
y:ev.clientY + document.body.scrollTop - document.body.clientTop
};
}
}
function getPosition(e, ev){
var ev = ev || window.event;
if(e.constructor==String){ e = document.getElementById(e);}
var left = 0, top = 0;
var coords = mouseCoords(ev);
while (e.offsetParent){
left += e.offsetLeft;
top += e.offsetTop;
e = e.offsetParent;
}
left += e.offsetLeft;
top += e.offsetTop;
return {x: coords.x - left, y: coords.y - top};
}
function dragdrop(local_click, caixa_movida) {
//local click indica quem é o cara que quando movido, move o caixa_movida
if(local_click.constructor==String){ local_click = document.getElementById(local_click);}
if(caixa_movida.constructor==String){ caixa_movida = document.getElementById(caixa_movida);}
local_click.style.cursor = 'move';
if(!caixa_movida.style.position || caixa_movida.style.position=='static'){
caixa_movida.style.position='relative'
}
local_click. = function(ev) {
objSelecionado = caixa_movida;
mouseOffset = getPosition(objSelecionado, ev);
};
document. = function() {
objSelecionado = null;
}
document. = function(ev) {
if (objSelecionado) {
var ev = ev || window.event;
var mousePos = mouseCoords(ev);
var pai = objSelecionado.parentNode;
objSelecionado.style.left = (mousePos.x - mouseOffset.x - pai.offsetLeft) + 'px';
objSelecionado.style.top = (mousePos.y - mouseOffset.y - pai.offsetTop) + 'px';
objSelecionado.style.margin = '0px';
return false;
}
}
}</script>
<body>
<!-- esta é a div de exemplo que será movida ao clicar no p de borda azul -->
<div id='movido' style='border: 1px solid black; width: 200px; '>
<p id='movedor' style='border: 1px solid blue;'>mova</p>
sou a div lálalá
<br />
lálálá
</div>
<!-- aqui o script chamando a função que ativa o drag'n'drop -->
<script>
dragdrop('movedor','movido');
</script>
</body>
13
yoompies
Prosseguindo com alguns códigos que uso sempre, abaixo mostro um drag-n-drop feito pelo tmferreira e corrigido por mim. Logicamente serve pra arrastar e mover elementos, divs, etc.
Uso ele quando não to afim de usar libs completas como o jquery.
Vou deixar direto o código completo até com o exemplo de uso. É só salvar o conteúdo [...]
Ler artigo "Drag and Drop - mover e arrastar divs e elementos" em seu site de origem » Artigos recentes deste blog
Assinar o feed para este Blog
3
yoompies
“Getting Real” (traduzido como “Caindo na Real”) é um livro e que descreve uma metodologia de desenvolvimento de negócios na internet.
Eu já tinha lido ele há muito tempo, mas ainda não tinha comentado ou implementado. Tô meio atrasado (o mundo inteiro já deve ter lido este livro) mas bora lá.
Ela prega que, a partir do [...]Ler mais »
5
yoompies
Pacote de plugins essenciais pra Wordpress na opinião deste Mico que vos fala.
Toda instalação de wordpress que eu faço (que não são muitas) eu uso os seguintes plugins que facilitam pra caramba minha vida. Acho que eles já deveriam vir (pelo menos alguns) no pacote inicial do wordpress hahehaehe.
Se você têm mais ae, sugira nos [...]Ler mais »
82
yoompies
Cenário real: A conta telefônica do senhor X, mais um dos zilhões dos clientes da Brasil Telecom, chega com valores indevidos. Ele tenta, por vários dias, ligar para a central de atendimento e corrigir os valores indevidos para poder pagar. Nunca consegue. Certo dia, um robô da Brasil Telecom, liga na casa do senhor X [...]Ler mais »
9
yoompies
Como alguns já sabem, a comunidade/fórum de desenvolvimento web ievolution mudou seu nome para Webly.
Foi necessário, então, fazer um redirecionamento de domínio para apontar para o novo Webly (webly.com.br). O cpanel cuidou de tudo direitinho, os users do fórum mal perceberam, não perdemos links e nem pagerank, graças ao bom e velho redirecionamento http 301.
Existem [...]Ler mais »
7
yoompies
“WTF mico? Are you Crazy?”
Calma malucada, não estou dizendo pra vocês voltarem ao século passado, quando referenciávamos os elementos via ‘document.all’ hehe. Na verdade este post é um incentivo pra vocês “apelidarem” alguns métodos e objetos, de forma facilitar a digitação de vocês.
//É que eu tava afim de fazer um título polêmico hahehahe
“Como assim?”
Estou cansado [...]Ler mais »
7
yoompies
Holá senhores e senhoras,
Hoje volto para mostrar um projeto muito interessante: PHP to Javascript Project: php.js
Vendo o tanto de gente querendo funções equivalente do PHP no javascript, os malucos tiveram a idéia de portar grande parte das funções do PHP para o javascript, usando a sintaxe mais próxima possível do php.
Assim, acabam ajudando a galera [...]Ler mais »
13
yoompies
Quer fazer aquela conhecida dupla de select’s com os estados e, ao lado, as cidades respectivas mas está cansado de quebrar a cabeça?
Cansado de tentar entender ajax pra fazer isto?
Cansado de tentar organizar um banco de dados pra isto?
Cansado de aguardar o navegador carregar (loading) as mil cidades que têm?
SEUS PROBLEMAS SE ACABARAM-SE!!!
O grande DGMike [...]Ler mais »
18
yoompies
Hohoho, olá senhoritos e senhoritas. Não sei se alguém ainda acompanha esta bagaça mas após alguns anos de férias o senhor Mico está de volta! Com menos tutoriais, com menos scripts, com menos tempo mas, ainda assim, está parcialmente de volta. hohohooo
Antes de explicar os motivos dos poucos tutoriais, vamos ao assunto principal do título [...]Ler mais »
13
yoompies
Prosseguindo com alguns códigos que uso sempre, abaixo mostro um drag-n-drop feito pelo tmferreira e corrigido por mim. Logicamente serve pra arrastar e mover elementos, divs, etc.
Uso ele quando não to afim de usar libs completas como o jquery.
Vou deixar direto o código completo até com o exemplo de uso. É só salvar o conteúdo [...]Ler mais »
10
yoompies
Helou senhores.
Muito tempo sem postar. Na verdade tava até pensando em abandonar o elmicox aqui, sei lá. Postar dá trabalho e toma tempo.
Mas daí lembrei que este troço aqui é meu repositório de códigos. Muito melhor que pastas do windows, muito melhor que zip, rar, melhor que ter que procurar em zilhoes de arquivos onde [...]Ler mais »
15
yoompies
Post rápido promocional do Webly macacada. Quem for do Rio de Janeiro, aproveite que é ‘di grátis’:
Promoção relâmpago do Webly para o 13º EWD-RJ, Famoso Encontro de Webdesign promovido pela Arteccom da Revista Webdesign.
A Arteccom deu 5 convites para o EWD - Rio de Janeiro de presente para os membros do Webly
…
Iremos fazer uma espécie [...]Ler mais »
12
yoompies
Chega um pouco de falar de javascript, css, programação, concordam?
Hoje o mico vai papear e falar sobre zumbis. “What?!?” - Isso mesmo, zumbis comedores de carne humana.
Em breve, vocês vão ver seu leitor de feeds lotar com notícias sobre o tal filme de zumbis rodado em Brasília.
O motivo é uma promoção do atoouefeito dando camiseta [...]Ler mais »
7
yoompies
Pois é…
Tem que tá com muuuuito tempo sobrando, ter muita criatividade e domínio do CSS. E o pior é que não ficou bizarro. O negócio ficou bom, muito bom.
Autor: Román Cortés
Descoberto via: Dkcell
o
o
o
o
(
O
O
O
\
L
(
O
O
O
O
O
\
L
(
O
|
|
\
\
|
|
\
\
\
\
(
(
8
o
o
o
(
(
8
o
o
o
o
)
)
b
o
O
o
o
o
o
o
o
)
b
o
O
o
o
o
o
o
o
o
o
o
/
/
/
•
•
•
•
•
_
_
_
•
•
•
C
C
O
(
-Ler mais »
8
yoompies
“Ôlha só quem estâ de vôoolta, êle mêêsmo, o Micôx, com notícias quentinhas. É fantâârdigo.” - Cid Moreira sobre Nova postagem no El Micox
Ae malucada, comecemos falando sobre a lentidão ao acessar o site do jquery, principalmente quando estamos apressados atrás de uma documentação sobre a api.
Porém há uma luz no fim do tunel. Em [...]Ler mais »
7
yoompies
Olá Sr. Senhor, que tal um banner com link do seu site alí em cima?
O Sr. Micox não ganha um mísero centavo para ficar postando tutoriais e códigos bala aqui e tava afim de explicar financeiramente para a patroa “por que motivos ele fica na frente do computador fazendo códigos pros outros em vez de [...]Ler mais »
5
yoompies
Pois é pois é pois é.
O desafio da vez no Webly é o:
“tchanaaam!!!” - Desafio WeblY de layouts! Como será o layout do Portal Webly em 2050?
Como o Webly é o mais superfodástico portal e fórum de tutoriais web, conseguimos vários patricínios e grana para poder oferecer VÁRIOS prêmios aos participantes deste desafio:
Pendrive da Emporio [...]Ler mais »
7
yoompies
HOoooaa. E ae malucada.
Há um tempo eu venho brigando em busca do código de menu css drop-down perfeito.
Eu queria um menu dropdown css pra copiar e colar, simples, rápido, sem precisar de configurações.
Apenas copiar/colar no meu CSS, definir cor e largura dos itens, usar a classe no html e pronto. E tudo funcionando nos navegadores [...]Ler mais »
Adicionar aos favoritos 
Artigos
Avalie este blog
Comentários
597 assinantes de feed
Google PageRank: 4
Backlinks: 69
Favoritos Delicious: 65
Por Micox JCG
-11
http://elmicox.blogspot.com
http://feeds.feedburner.com/elmicox
