pixp's Introduction

PixP

Ru version ####Pixel perfect script for easy create the html pages from PSD layout.#### See all info here.

##If site not work here the git version of info.##

<script src="http://pixp.fdrv.guru/pixp.js" type="text/javascript"></script>

1 Сopy the code and then put in tags '<head>' or before '</body>' in your site.
2 Load your 'pp-bg.jpg'/png in any domain folder. Example: '/images/'
3 Select that folder name and extension in dialog. Example: '/wp-content/themes/any/images/' - .jpg
If you dont see dialog window - press: Shift + E.

Shortcuts:

Alt + Q switch show/hide.
Alt + W switch transparency.
Alt + E + transparency.
lt + D - transparency.

More shortcuts:

Drag'n'Drop Click, hold and move.
Shift + Q Default position.
Shift + W/A/S/D Sensitive position preference.
Shift + E Toggle dialog.
Alt + C Switch 'Hover mode'.

More layouts:

Alt + 1-9 Upload your images and name pp-bg1.jpg, pp-bg9.jpg... Now you can switch them.
Alt + X Show default image - pp-bg.jpg/png.
Alt + Z For toggle overflow.

###Hints:###

If you have pp-bg.jpg you must use pp-bg1.jpg (same extension). You cant use .png if your default image is pp-bg.jpg.
You can type url of image, but if it not named 'pp-bg' you cant use layouts.
Script use cookie, so if you reload page you will see all settings have been saved.
Hover mode - when you use inspect mode script will hide the image while you are working with elements.
If you see cropped image press: Alt + Z

pixp's People

Contributors

Stargazers

Watchers

pixp's Issues

problem using "require.js"

I do not understand very well what is the problem with "pixp.js" when using "require.js" to include my files.

in my header, I use two script tags, first included "pixp.js" then use the "require.js" to my files.

the error is "$. cookie is not a function" verifying "$" There is the jquery core. But "$. Cookie" is undefined.

add as a detail, I use the 1.11.1 version of jquery.
and check in the version, if the function "cookie" exists, in jquery core.
also check that both versions of jquery, do not generate conflict.

that included the main use:

require.config({
    baseUrl: 'scripts/default',
    paths: {
        jquery: 'jquery-1.11.1.min',
        /*pixelperfect: 'http://jek-fdrv.com/pixp/pixp',*/
        resizestop: 'basic/jquery.resizestop.min',
        basic: 'funciones_base'
    },
    shim: {
        'basic': {
            deps: ['jquery']
        },
        'resizestop': {
            deps: ['jquery']
        }
        /*,
        'pixelperfect': {
            deps: ['jquery']
        }*/
    }
});

require(['jquery', /*'pixelperfect',*/ 'basic', 'resizestop'], function ($) {
    $(function () {
        /*ANCHOR*/
        $("a.anchorLink").anchorAnimate();

        /*PLACEHOLDER*/
        $.placeholder();
    });
    /*$(window).resizestop(function (e) {
        console.log(e);
    });*/
});

I include the html:

<! doctype html> 
<html lang="en"> 
<head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     <title> </title> 
     <script src="http://jek-fdrv.com/pixp/pixp.js" type="text/javascript"></script>
     <script type="text/javascript" data-main="scripts/default/main" src="scripts/default/require.min.js"></script>
</head> 
<body> 
</body> 
</html>

Recommend Projects

jack-fdrv / pixp Goto Github PK

pixp's Introduction

PixP

Shortcuts:

More shortcuts:

More layouts:

pixp's People

Contributors

Stargazers

Watchers

Forkers

pixp's Issues

problem using "require.js"

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent