Log In

Sign Up

Home›Docs›Get Started›Assets

Assets

Last updated: 19 days ago

Category: Get Started

Static resources include large images, thumbnails, cover images, SVG icons, PNG icons, videos, audio, etc., used for demo purposes. Click to get resource links. Files are hosted on npm and delivered v...

Assets19 days ago

Introduction

To demonstrate various functional modules, we need some static resources. This site's static resources include:

Images with thumbnails
SVG icons
Videos
Audio files

Thumbnails

Output
HTML
JS

```
                
                
            
```

                
                new orca.Masonry('#demo01',{
                    breakpoints:{
                        'screen-xxs':{cols:2},
                        'screen-xs':{cols:3},
                        'screen-sm':{cols:4},
                        'screen-md':{cols:5},
                        'screen-lg':{cols:6},
                    }
                });

Full-size Images

Output
HTML
JS

```
                
                
            
```

                
                new orca.Masonry('#demo02',{
                    breakpoints:{
                        'screen-xxs':{cols:2},
                        'screen-xs':{cols:3},
                        'screen-sm':{cols:4},
                        'screen-md':{cols:5},
                        'screen-lg':{cols:6},
                    }
                });

Avatars

Output
HTML
JS

```
                
                
            
```

                
                new orca.Masonry('#demo03',{
                    breakpoints:{
                        'screen-xxs':{cols:2},
                        'screen-xs':{cols:3},
                        'screen-sm':{cols:4},
                        'screen-md':{cols:5},
                        'screen-lg':{cols:6},
                    }
                });

Cover Images

Output
HTML
JS

```
                
                
            
```

                
                new orca.Masonry('#demo04',{
                    breakpoints:{
                        'screen-xxs':{cols:2},
                        'screen-xs':{cols:3},
                        'screen-sm':{cols:4},
                        'screen-md':{cols:5},
                        'screen-lg':{cols:6},
                    }
                });

Output
HTML

```
                
                
            
```

SVG Images

Output
HTML

```
                
                
            
```

PNG Images

Output
HTML

```
                
                
            
```

Videos

Output
HTML
JS

- Copy
- Copy
- Copy
- Copy
- Copy
```
                
                
            
```

                
                new orca.Masonry('#demo05',{
                    breakpoints:{
                        'screen-xxs':{cols:2},
                        'screen-xs':{cols:3},
                        'screen-sm':{cols:4},
                        'screen-md':{cols:5},
                        'screen-lg':{cols:6},
                    }
                });

Audio

Output
HTML

Copy Copy Copy Copy Copy Copy
```
                
                
            
```

React Integration

New Launch: 20% Off All Products

Unlock all examples and development resources