# Problem when bind texture with no repeat

**URL:** <https://discourse.threejs.org/t/problem-when-bind-texture-with-no-repeat/47856>\
**Category:** Questions\
**Tags:** textures, shaders\
**Created:** [February 10, 2023, 7:35am UTC](https://discourse.threejs.org/t/problem-when-bind-texture-with-no-repeat/47856 "2023-02-10T07:35:51Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Nguyen\_Trong\_Van](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/nguyen_trong_van/32/33302_2.png) [@Nguyen\_Trong\_Van](https://discourse.threejs.org/u/Nguyen_Trong_Van)\
**Post date:** [February 10, 2023, 7:35am UTC](https://discourse.threejs.org/t/problem-when-bind-texture-with-no-repeat/47856/1 "2023-02-10T07:35:51Z")

</div>

Hi, everybody. I have a problem when bind texture with no repeat. Please watch this video:

[https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/2/b/2b09b71a7cef2225380174d8f638b179b98a51c1.webm](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/2/b/2b09b71a7cef2225380174d8f638b179b98a51c1.webm)
  
When i move this texture in other texture i want result like that:  
 ![result](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/0/7/07841b093e2f91fb9f577276e9a38c4d25bb7ec5.jpeg)  
But i get bad result:  
 ![question-pic](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/0/9/0901ccba400e08f960a3b8ee5c6d7a239e689fd0.png)

My code:

```javascript
const fr = `
  uniform vec2 u_resolution;
  uniform sampler2D inputImageTexture;
  uniform sampler2D inputImageTexture2;
  uniform vec2 positionChange;

  varying vec2 vertexUV;

  void main(){
    vec4 mask = texture2D(inputImageTexture,vertexUV);
    vec4 maskPig = texture2D(inputImageTexture2,vertexUV - positionChange);
    
    vec3 total = mask.xyz * maskPig.xyz;
    gl_FragColor = vec4(total,1.0);
  }
`;
let texture1 = new TextureLoader().load("./Assets/iphone14-5.jpg");
texture1.wrapS = ClampToEdgeWrapping;
texture1.wrapT = ClampToEdgeWrapping;

const shaderMaterial = new ShaderMaterial({
  uniforms: {
    positionChange:{ value: new Vector2(0,0)},
    u_resolution: {
      value: new Vector2(renderer.domElement.width,renderer.domElement.height),
    },
    inputImageTexture: {
      value: new TextureLoader().load("./Assets/star.png"),
    },
    inputImageTexture2:{
      value: texture1,
    }
  },
  vertexShader: vs,
  fragmentShader: fr,
});

```

How should I solve this problem?

---

<div class="post-metadata">

**Author:** ![PavelBoytchev](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pavelboytchev/32/38639_2.png) [@PavelBoytchev](https://discourse.threejs.org/u/PavelBoytchev)\
**Post date:** [February 10, 2023, 7:54am UTC](https://discourse.threejs.org/t/problem-when-bind-texture-with-no-repeat/47856/2 "2023-02-10T07:54:31Z")

</div>

Have you tried to add a white border in your texture? In this way the white border will be copied to the left.